1.安装nodejs-websocket 和 socket.io
npm install nodejs-websocket socket.io
2.html 中引入socket.io.js文件
在html中 通过 socket = io(\'ws://localhost:3000/\');开启socket连接,通过socket.emit(‘对应于服务器的自定义事件名’,‘内容’)发送信息,socket.on(‘对应于服务器的事件名’,‘内容’)接受信息
代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="socket.io.js"></script>
<script type="text/javascript" src="jquery-2.1.4.min.js"></script>
</head>
<body>
<input type="text" name="" id="cont" value="" />
<button type="button" id="send">发送</button>
<script type="text/javascript">
const socket = io(\'ws://localhost:3000/\');
function showMessage(str,type){
var div = document.createElement(\'div\');
div.innerHTML = str;
if(type==\'enter\'){
div.style.color = \'royalblue\'
}else if(type==\'leave\'){
div.style.color = \'red\'
}
document.body.appendChild(div)
}
$(\'#send\').on(\'click\',function(){
var txt = $(\'#cont\').val();
if(txt){
socket.emit(\'message\',txt)
}
})
socket.on(\'enter\', (data) => {
showMessage(data,\'enter\')
// socket.emit(\'my other event\', { my: \'data\' });
});
socket.on(\'message\', (e) => {
showMessage(e,\'message\')
});
socket.on(\'leave\', (e) => {
showMessage(e,\'leave\')
});
</script>
</body>
</html>
服务器端(server.js)
const app = require(\'http\').createServer() const io = require(\'socket.io\')(app); var clinet = 0; var port = 3000 app.listen(port); io.on(\'connection\', (socket) => { clinet++; socket.nickname = "user"+clinet io.emit(\'enter\', socket.nickname + "进入聊天室"); socket.on(\'message\', (data) => { io.emit(\'message\', socket.nickname + ":"+data); }); socket.on(\'disconnect\', (data) => { io.emit(\'leave\', socket.nickname + "离开聊天室"); }); }); console.log(\'server is running on \'+port)
然后通过node server.js启动服务