| FazBrowse GitHub Viewer | Trending | | Home |
| Tools: [Download Repo ZIP] [Original HTTPS Page] |
| Name | Name | Last commit date | ||
|---|---|---|---|---|
parent directory.. | ||||
HTTP 协议可以总结几个特点:
TCP 协议可以总结几个特点:
WebSocket 目前由 W3C 进行标准化。WebSocket 已经受到 Firefox 4、Chrome 4、Opera 10.70 以及Safari 5 等浏览器的支持。 如果在前端我们可以把 AJAX 请求当作一个 HTTP 协议的实现,那么,WebSocket 就是 UDP 协议的一种实现。
var socketServer = require('ws').Server;
var wss = new socketServer({
port: 8080
});var app = require('express')();
var server = require('http').Server(app);
var socketServer = require('ws').Server;
var wss = new socketServer({server: server, port: 8080});wss.on('connection', function (client) {
client.on('message', function (_message) {
var _messageObj = JSON.parse(_message);
//status = 1 表示正常聊天
_messageObj.status = 1;
this.message = _messageObj;
//把客户端的消息广播给所有在线的用户
wss.broadcast(_messageObj);
});
// 退出聊天
client.on('close', function() {
try{
this.message = this.message || {};
// status = 0 表示退出聊天
this.message.status = 0;
//把客户端的消息广播给所有在线的用户
wss.broadcast(this.message);
}catch(e){
console.log('刷新页面了');
}
});
});
//定义广播方法
wss.broadcast = function broadcast(_messageObj) {
wss.clients.forEach(function(client) {
client.send(JSON.stringify(_messageObj))
});
}; if(!WebSocket){
$('.connState').text("您的浏览器不支持WebSocket");
return false;
}
//连接 socket 服务器
var socket = new WebSocket('ws://localhost:8080');//监听 socket 的连接
socket.onopen = function(){
$('.connState').text("服务已连接 ws://localhost:8080");
}//监听服务端断开
socket.onclose = function(){
$('.connState').text("服务已断开");
socket = null;
}//监听服务端异常
socket.onerror = function(){
$('.connState').text("服务错误");
socket = null;
}//监听服务端广播过来的消息
socket.onmessage = function(msg){
var msgObj = JSON.parse(msg.data);
if(msgObj.status == 0){
$('<p>' + msgObj.nickname + '[' + msgObj.time + ']退出聊天</p>').appendTo('.msgList');
} else{
$('<p>' + msgObj.nickname + '[' + msgObj.time + ']:' + msgObj.message + '</p>').appendTo('.msgList');
}
}var sendMessage = function(_mess){
if(socket){
var myDate = new Date();
var now = myDate.getMonth() + '-' + myDate.getDate() + ' ' + myDate.getHours() + ':' + myDate.getMinutes() + ':' + myDate.getSeconds();
var mesObj = {
nickname: $('#nickName').val(),
message: _mess || $('#mesBox').val(),
time: now
}
//向服务端发送消息
socket.send(JSON.stringify(mesObj));
}
}该案例是一个多人聊天室
运行步骤
案例思路
| Back | FazBrowse Home | New Git URL |