关于Node.js安装搭建WebSocket环境及简单实时通信实现方法讲解
WebSocket的出现是基于Web应用的实时性需要而产生的。这种实时的Web应用大家应该不陌生,在生活中都应该用到过,比如新浪微博的评论、私信的通知,腾讯的WebQQ等。让我们来回顾下实时 Web 应用的窘境吧。
在WebSocket出现之前,一般通过AJAX轮询来实现Web实时用。我本人也是通过js定时刷新并通过AJAX查询MYSQL数据库存入的指令,判断下一步的运作,在执行完动作后,写入已完成标记,再进入轮询等待下一步指令。现在我们使用websocket实现了浏览器与服务器全双工通信(full-duplex)。HTML5定义了WebSocket协议,能更好的节省服务器资源和带宽并达到实时通讯。也解决了我当时因为轮询造成的服务器压力。
我个人是做PHP开发,但对实时通信很感兴趣,只是觉得node.js实现这个比较简单,就琢磨了一下,现在把整个过程记录下来,与大家分享。
下面就讲一下,如何安装Node.js,这里安装的版本是:node-v10.8.0-x64,大家可以网上下载,这里因为资源有限,不方便上传,有需要也可以联系我QQ发给你。
软件双击安装后都是正常下一步就可以了,其中就有一步需要大家注意,主要注意点如下选择“Add to PATH”,因为这样会自动给你配置对应的环境变量,其余的都是直接下一步然后install。
安装完成后,检测PATH环境变量是否配置了Node.js,点击开始=》运行=》输入"cmd" => 输入命令"path",输出如下结果:
C:\Users\hello>path PATH=C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32 \WindowsPowerShell\v1.0\;C:\Program Files\Lenovo\Touch Fingerprint Software\;c:\ Program Files (x86)\QuickTime\QTSystem\;C:\Program Files\nodejs\;D:\phpStudy\PHP Tutorial\php\php-5.6.27-nts\;C:\Users\hello\AppData\Roaming\npm
我们可以看到环境变量中已经包含了C:\Program Files\nodejs\
检查Node.js版本
安装websocket
cmd打开控制台 输入命令:npm install nodejs-websocket (必须连接互联网)
到此,文件已经安装成功。
下面给出三个文件:
(1)node.js,这个是服务端用于接收及广播信息用的,也就是从终端浏览器发送过来,进行信息处理加工再发送出去的。服务器端的监听端口也在这里设置。(这个文件要放在node_modules\nodejs-websocket目录下,具体位置,请看第三个文件)
var ws = require("nodejs-websocket") const PORT = 4455; // 每进来一个客户端就记录一下 var clientCount = 0; var server = ws.createServer(function(conn) { console.log("New connection") clientCount++; conn.nickname = 'user' + clientCount; let mes = {}; mes.type = "enter"; mes.data = conn.nickname + ' comes in' broadcast(JSON.stringify(mes)); conn.on("text", function(str) { console.log("Received " + str); let mes = {}; mes.type = "message"; //mes.data = conn.nickname + ' says:' + str; mes.data = str; broadcast(JSON.stringify(mes)); }) conn.on("close", function(code, reason) { console.log("Connection closed"); let mes = {}; mes.type = "leave"; mes.data = conn.nickname + ' left' broadcast(JSON.stringify(mes)); }) conn.on("error", function(err) { console.log("handle err"); console.log(err); }) }).listen(PORT); console.log("websocket server running on port: " + PORT); function broadcast(str) {//这个是进行广播用的,即将接收的信息发送给所有已经连接通信的终端,如果不进行广播,谁发送再直接返回给谁那就失去意义了。 server.connections.forEach(function(connection) { connection.sendText(str); }) }
(2)index.php这个是浏览器终端,给用户输入信息或指令用的,大家要灵活运用,比如用这个做为一个控制台发送指令,管理全部终端的动作指令,至于如何区分不同终端,建议大家给每个页面挂一个参数,同时在返回的指令前加一个前缀,判断指令是发送给谁的,这只是一个简单的处理办法。或者大家也可以安装node-uuid来处理这个事件。(这个文件放在你web的目录里,哪个地方用就放里,相当于一个独立页面)
<!DOCTYPE html> <html> <head> <meta charset="gb2312"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>websocket聊天室</title> </head> <body> <input id="sendTxt" type="text"> <button id="send">send</button> <script type="text/javascript"> var websocket = new WebSocket("ws://192.168.1.102:4455/"); websocket.onopen = function() { console.log("websocket open"); // 发送消息放在这里 document.getElementById("send").onclick = function() { var txt = document.getElementById("sendTxt").value; if (txt) { websocket.send(txt); } } } websocket.onclose = function() { console.log("websocket close"); } // 只接收字符串参数,所以在服务端相传对象过来可以用JSON先转换成字符串,然后在这边转成对象 websocket.onmessage = function(e) { console.log(e.data); var mes = JSON.parse(e.data); showMessage(mes.data, mes.type); } // 显示消息函数 function showMessage(str, type) { var div = document.getElementById("abc"); if (type == "enter") { div.style.color = "red"; } else if (type == "message") { div.style.color = "blue"; } else if (type == "leave") { div.style.color = "green"; } document.getElementById("abc").innerHTML = str; } </script> <div id="abc"></div> </body> </html>
(3)另外对于启动nodejs-websocket服务,我是通过建立一个bat文件来实现的。将以下内容用记事本保存,并将文件名改为“启动nodejs_websocket.bat”,注意结尾是bat。大家也可以在cmd命令行中直接执行以下命令也可启动服务。
node C:\Users\hello\node_modules\nodejs-websocket\node.js
到此,nodejs-websocket的安装及基本使用已经完成。刚才讲的node.js放置的位置,也就是这个路径了,具体要看一下执行完npm install nodejs-websocket后,nodejs-websocket所在哪个位置,就把node.js放这个文件夹里就行了。我想我讲的应该很清楚了吧。
现在大家就可以试试,用不同的电脑访问index.php文件,任意一个发送一个指令信息,其它终端浏览器是不是也都同时收到了?这个真的是解决了很大问题,即减少了轮询对数据库和服务器的压力,又保证了实时性,这样对于大家今后开发远程终端控制有很大帮助。
回过头来总结一下,我们刚刚已经把安装过程讲解了,我估计大家和我一样最初对于实时通信是如何使用是迷茫的,想必现在已经思路清晰了,我们可以这样理解,node.js是服务器端接收指令并转发给其它终端的,index.php实现的就是发送指令的。现在哪个文件放在哪里,起什么作用大家应该明白了,我也就讲这么多了,有不到之处请大家理解。
- ● blob:http地址的原理及生成方法
- ● 华视CVR100系统身份证读卡器web驱动安装不识别解决办法
- ● web应用采用webcam实现拍照上传的PHP示例及参数说明
- ● PHP实现直播推流功能
- ● win10开机后屏幕黑屏只有鼠标但能启动任务管理器
- ● base64.js文件下载及使用方法说明
- ● 百度API提交推送报{"error":401,"message":"tokenisnotvalid"}什么原因
- ● 如果在调用创建群接口时没有保存OpenConversationId,可以通过调用本接口通过chatId获取OpenConversationId
- ● Windows中使用BAT文件设置指定IP地址或自动获取IP
- ● php中如何对PHPSESSIDcookie设置httponly
- ● MySQLSUM在没有符合查询条件时返回结果为空的处理办法
- ● 如何开启PHP8的JIT提升运行速度
- ● 钉钉API接口-用PHP+Curl实现获取用户信息
- ● 钉钉API接口-用PHP+Curl实现获取应用Access_Token
- ● 在PHP中使用CURL,“撩”服务器只需几行——phpcurl详细解析和常见大坑
- ● MySQLInnodb并发涉及参数说明
- ● mysql参数调优之innodb_thread_concurrency、innodb_concurrency_tickets合理的使用cpu性能
- ● PHP用fsockopen检测指定IP端口是否开启可用
- ● PHP用socket检测服务器IP端口是否开放?代码示例
- ● GatewayWorker报错:Waring:Events::onMessageisnotcallable