Nodejs+Websocket如何實(shí)現(xiàn)指定發(fā)送及群聊-創(chuàng)新互聯(lián)

這篇文章主要介紹了Nodejs +Websocket如何實(shí)現(xiàn)指定發(fā)送及群聊，具有一定借鑒價(jià)值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

陽原ssl適用于網(wǎng)站、小程序/APP、API接口等需要進(jìn)行數(shù)據(jù)傳輸應(yīng)用場(chǎng)景，ssl證書未來市場(chǎng)廣闊！成為創(chuàng)新互聯(lián)公司的ssl證書銷售渠道，可以享受市場(chǎng)價(jià)格4-6折優(yōu)惠！如果有意向歡迎電話聯(lián)系或者加微信：028-86922220（備注：SSL證書合作）期待與您的合作！

目的

通過nodejs + ws (Websocket) 實(shí)現(xiàn)點(diǎn)對(duì)點(diǎn)發(fā)送及群聊發(fā)送
項(xiàng)目搭建直接跳過，這里列舉一下用到的插件
yarn add ws

WebSocket

話不多說，直接上碼

對(duì)比上一篇文章 << Nodejs+MongoDB 搭建服務(wù)( demo ) >> server.js 主要是增加了ws的引用，
webSocket 點(diǎn)對(duì)點(diǎn)也好，群聊也好，主要是用到一個(gè)方法 clients 它的作用就是存儲(chǔ)了連接，
我們可以通過對(duì)每一個(gè)連接增加標(biāo)識(shí)，然后根據(jù)接收到的信息進(jìn)行解析，遍歷然后發(fā)送正確的響應(yīng)。

Nodejs +Websocket如何實(shí)現(xiàn)指定發(fā)送及群聊

先解析下代碼（小聲BB）, 下面會(huì)有HTML頁面

 nbs.on("connection", (ws, req) => {
   ws.on("message", message => {
    // 這里解析數(shù)據(jù)
    const result = JSON.parse(message);
    // 是否是登陸，登陸后綁定id
    if (result.login) {
     ws.socketIdxos = result.id;
    } else {
     // 這里只做一個(gè)小的場(chǎng)景，不是登陸就是發(fā)送信息
     // 根據(jù)存儲(chǔ)的id 是否是要 發(fā)送的對(duì)象 來單獨(dú)響應(yīng)
     nbs.clients.forEach(s => {
      if (s.socketIdxos == result.to && s.readyState == 1) {
       s.send(JSON.stringify({ data: result.mes }));
      }
     });
    }
   });
   ws.on("close", message => {
    console.log(ws.socketIdxos,"退出連接");
   });
  });

HTML

這里我分別建了三個(gè)頁面其中兩個(gè)模擬用戶，一個(gè)模擬群聊

這是BBB用戶，另一個(gè)頁面是 AAA 只是改了下信息而已，就不都貼上來了，很簡(jiǎn)單

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>BBB111</title> 
  <script>
  const ws = new WebSocket("ws://localhost:8181");
  ws.onopen = function (e) {
   ws.send(JSON.stringify({
    "id":"BBB111",
    "login":true,
   }));
  }
  function sendMessage() {
    ws.send(JSON.stringify({
    "id":"BBB111", // 當(dāng)前ID
    "login":false, // 是否登陸
		"to":"AAA111", // 發(fā)送對(duì)象
		"mes":"我是BBB111,這是發(fā)送給AAA111的消息" // 發(fā)送內(nèi)容
   }));
  }
	function sendYUYUYU() {
    ws.send(JSON.stringify({
    "id":"BBB111",
    "login":false,
		"to":"YUYUYU",
		"mes":"我是BBB111,這是到群里的消息"
   }));
  }
  ws.onmessage = function (e) {
   console.log(e,"eeee-");
  }
  </script>
 </head>
  
 <body >
   <button onclick="sendMessage();"> 發(fā)送 </button>
	 <button onclick="sendYUYUYU();"> 群聊 </button>
 </body>
 </html>

下面的是只用來接收的群頁面，更簡(jiǎn)單

 <!DOCTYPE html>
  <html>
   <head>
    <meta charset="utf-8">
    <title>群聊</title>
    <script>
    const ws = new WebSocket("ws://localhost:8181");
    ws.onopen = function (e) {
     // 這里主要作用就是注冊(cè)下群成立了 ......
     ws.send(JSON.stringify({ 
      "id":"YUYUYU", 
      "login":true,
     }));
    }
    ws.onmessage = function (e) {
     console.log(e,"eeee-");
    }
    </script>
   </head>
    
   <body >
  
   </body>
   </html>

展示

const ws = new WebSocket("ws://localhost:8181");
 localhost 可以換成的你的本機(jī)IP，這樣頁面在其他電腦也可以發(fā)送到你的頁面上

Nodejs +Websocket如何實(shí)現(xiàn)指定發(fā)送及群聊

可以看到，在BBB的頁面，接收到了AAA發(fā)送的信息

Nodejs +Websocket如何實(shí)現(xiàn)指定發(fā)送及群聊

無論是AAA發(fā)送的群里信息，還是BBB發(fā)送的群里信息，在群聊頁面都是可以看到的

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“Nodejs +Websocket如何實(shí)現(xiàn)指定發(fā)送及群聊”這篇文章對(duì)大家有幫助，同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)，關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，更多相關(guān)知識(shí)等著你來學(xué)習(xí)!

網(wǎng)站標(biāo)題：Nodejs+Websocket如何實(shí)現(xiàn)指定發(fā)送及群聊-創(chuàng)新互聯(lián)
URL標(biāo)題：http://www.rwnh.cn/article0/cchhoo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站排名、外貿(mào)網(wǎng)站建設(shè)、搜索引擎優(yōu)化、網(wǎng)站維護(hù)、營(yíng)銷型網(wǎng)站建設(shè)、網(wǎng)站改版

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

Nodejs+Websocket如何實(shí)現(xiàn)指定發(fā)送及群聊-創(chuàng)新互聯(lián)