在前后端数据交互的时候我们经常使用的是ajax，用的是传统的http协议，而http协议有个致命的缺点，就是请求一结束，连接就断开了， 我们为了保持这个链接的，通常会使用cookie，而自从h5出现websocket之后，妈妈再也不用担心我的请求了，可以愉快的玩耍了，websocket是TCP协议，也就是所谓的“长连接”，可以一直保持，客户端与服务端的连接，交互起来自然是so easy ,to happy,这两天利用工作之余，写了一个基于nodejs和websocket的聊天室，只为说明原理，没有做任何的样式，不喜勿喷
这是客户端：
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title></head><body><input type="text" id="input"/><input type="button" value="发送" id="btn"/></body><script>var websocket = new WebSocket("ws://localhost:3000/");function showMessage(type,str){var div = document.createElement(‘div‘);div.innerHTML = str;if(type == ‘enter‘){div.style.color = ‘blue‘;}else if(type == ‘leave‘){div.style.color = ‘red‘;}document.body.appendChild(div);}websocket.onopen = function(){//连接成功后的回调document.getElementById(‘btn‘).onclick = function(){var txt = document.getElementById(‘input‘).value;if(txt){websocket.send(txt);}}}websocket.onclose = function(){//关闭连接的回调}websocket.onmessage = function(e){//发送消息的回掉var msg = JSON.parse(e.data);showMessage(msg.type,msg.data);}</script></html>这是服务端：
var ws = require("nodejs-websocket") ???//导入nodejs-websocket模块var PORT = 3000;var clientCount = 0;// Scream server example: "hi" -> "HI!!!"var server = ws.createServer(function (conn) { ???????//建立连接时 ???console.log("New connection") ???clientCount++; ???conn.nickname = ‘user‘+clientCount; ???????????????//每一个用户名 ???var msg = {}; ???msg.type = "enter"; ???????//消息的类型， ???msg.data = conn.nickname + ‘ ?进入了聊天室‘; ???????msg = JSON.stringify(msg); ???//数据格式化 ???broadcast(msg); ???????//用于广播数据 ???????console.log(msg); ???conn.on("text", function (str) { ???????console.log("Received "+str) ???????var msg = {}; ???????msg.type = ‘message‘; ???????msg.data = conn.nickname + ‘：‘ + str; ???????msg = JSON.stringify(msg); ???????broadcast(msg); ???}) ???conn.on("close", function (code, reason) { ???????//链接关闭的回调，注意这个一定要写，否则在关闭页面的时候，服务会抛异常； ???????console.log("Connection closed") ???????var msg = {}; ???????msg.type = ‘leave‘; ???????msg.data = conn.nickname +‘离开了‘; ???????msg = JSON.stringify(msg); ???????broadcast(msg); ???????????}) ???conn.on("error", function (err) { ???//出错时候的回调； ???????console.log(err); ???})}).listen(PORT);function broadcast(str){ ???server.connections.forEach(function(connection){ ???//遍历所有的链接 ???????connection.sendText(str); ???????????????????????//给每一个链接发送数据 ???});}有说的不对的欢迎大家吐槽，大家相互学习。
websocket搭建的聊天室
原文地址：https://www.cnblogs.com/chenzhiyu/p/8315501.html