Node.js笔记-使用socket.io构建websocket聊天室

先安装socket.io

npm install socket.io

服务端代码：

let app = require('http').createServer();
let io = require('socket.io')(app, { cors: true });let port = 3000;
let clientCount = 0;app.listen(port);io.on('connection', function (socket) {clientCount++;socket.nickname = 'user' + clientCount;io.emit('enter', socket.nickname + ' comes in');socket.on('message', function (str) {io.emit('message', socket.nickname + ' says: ' + str);})socket.on('disconnect', function () {io.emit('leave', socket.nickname + ' left');})
});console.log("Websocket server listening on port = " + port)

客户端代码：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>WebSocketIO</title><script src="https://cdn.socket.io/4.0.1/socket.io.js"></script>
</head>
<body><h1>Chat Room</h1><input id="sendTxt" type="text" /><button id="sendBtn">发送</button><script type="text/javascript">let socket = io("ws://localhost:3000/");function showMessage(str, type){let 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);}document.getElementById("sendBtn").onclick = function () {let txt = document.getElementById("sendTxt").value;if(txt){console.log(txt)socket.emit('message', txt);}}socket.on('enter', function (data) {showMessage(data, 'enter');})socket.on('message', function (data) {showMessage(data, 'message');})socket.on('leave', function (data) {showMessage(data, 'leave');})</script>
</body>
</html>

运行截图如下：

退出：

Node.js笔记-使用socket.io构建websocket聊天室相关推荐

Express+Socket.IO 实现简易聊天室
代码地址如下: http://www.demodashi.com/demo/12477.html 闲暇之余研究了一下 Socket.io,搭建了一个简易版的聊天室,如有不对之处还望指正,先上效果图: ...
基于socket.io的web聊天室
基于socket.io的web聊天室一. 项目介绍该项目使用node.js作为后端服务器框架,并利用socket.io来实现web聊天室功能.socket.io是由 JavaScript 实现的基 ...
如何使用Vue，Phaser，Node，Express和Socket.IO构建多人桌面游戏模拟器
Putting together all of the pieces of a full stack JavaScript application can be a complex endeavor. ...
dotnet调用node.js写的socket服务（websocket/socket/socket.io）
https://github.com/jstott/socketio4net/tree/develop socket.io服务端node.js,.里面有js写的客户端:http://socket.io ...
node+socket.io+HTTP简易聊天室
用node+socket.io+HTTP做一个聊天室.聊天室主要由两部分构成,服务器(index.js)以及客户端(index.html). 文件目录如下所示: (node_modules文件夹以及p ...
node+socket.io 实现一个聊天室
我们只做简单的实现,不接入数据库,nodejs也不使用express和koa等框架因此依赖只有两个: 1.socket.io 2.mime(用于获取静态资源时获取文件的mime类型) 安装命令: n ...
php做群聊功能,使用socket.io 实现群聊天室
本篇向大家分享一个socket.io的使用实例,实现群聊天的功能.如果想使用socket.io那么必须借助于nodejs来实现服务端,因此我们需要在nodejs中安装socket.io 安装socke ...
使用Node.js+Socket.IO搭建WebSocket实时应用
Web领域的实时推送技术,也被称作Realtime技术.这种技术要达到的目的是让用户不需要刷新浏览器就可以获得实时更新.它有着广泛的应用场景,比如在线聊天室.在线客服系统.评论系统.WebIM等. 作 ...
[读书笔记]从物联到万联——Node.js与树莓派万维物联网构建实战
前言本文是"从物联到万联,Node.js与树莓派万维物联网构建实战"一书的读书笔记,该书翻译自"Building the Web of Things with exam ...

Node.js笔记-使用socket.io构建websocket聊天室

Node.js笔记-使用socket.io构建websocket聊天室相关推荐

最新文章

热门文章