日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

node+socket.io 实现一个聊天室

發布時間:2025/3/8 编程问答 27 豆豆
生活随笔 收集整理的這篇文章主要介紹了 node+socket.io 实现一个聊天室 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

我們只做簡單的實現,不接入數據庫,nodejs也不使用express和koa等框架 ?

因此依賴只有兩個: 1、socket.io 2、mime(用于獲取靜態資源時獲取文件的mime類型)?

?安裝命令: npm install socket.io mime --save?

?其他的就不贅述了 先描述一下文件目錄結構


靜態 js 和 css 文件放在 public 下面的相應目錄下

socket連接是基于tcp的因此需要給socket傳入一個http服務的實例,這樣就能啟動socket服務

var http = require('http'); var socketio = require('socket.io'); var server = http.createServer(); io = socketio(server);server.listen(3001); 復制代碼

當然,socket.io不止提供了一種啟動方式,這里就不一一列舉了?

?socketio(server) 返回的是一個 socket 實例,通過這個實例可以監聽客戶端的 connection事件,事件監聽的第二個參數是一個回調函數,會掉函數也會返回一個socket對象,這個 socket 對象可以監聽這個鏈接的另一端觸發的事件(這里就是客戶端) ?

這里需要搞清楚的一點是,每個socket連接都會在 connection 事件的回調中返回一個socket 對象,這個對象可監聽對應客戶端觸發的事件,也可以向其他的socket對象廣播消息?

?通過connection 事件返回的 socket 對象觸發和監聽事件:?

io.on('connection', function(socket) {// 監聽客戶端發送的message事件socket.on('message', function() {// 向同一個房間中的其他用戶廣播消息socket.broadcast.to(message.room).emit('message', {text: nickNames[socket.id] + ': ' + message.text});});// 觸發事件socket.emit('message', {nick: 'Lily',content: 'hello world!'}); }); 復制代碼

現在我們知道了如何在服務端創建socket 服務,那么客戶端應該應該怎么和服務端的socket服務創建連接呢?

html頁面引入的其他 js 文件這里就不說了,這里需要說明的是socket.io.js:

<script src="/socket.io/socket.io.js"></script> 復制代碼

我剛開始的時候也是很疑惑,因為這個文件在我的服務其中根本不存在。事實是,這個文件是socket 服務器啟動后自動生成的。因此我們只需要在html文件中按照這個路徑引入就行了。?

引入socket.io.js 后就會有一個全局的 io 對象,用于觸發事件和監聽服務器 socket 服務器觸發的事件 客戶端事件監聽:

var socket = io.connect();$(document).ready(function() {// 監聽服務器發送的事件socket.on('message', function(message) {var newElement = $('<div class="msg-box"></div>').append($('<span></span>').text(message.text));$('#messages').append(newElement);});}); 復制代碼

客戶端觸發事件:

socket.emit('message', {nick: 'Lily',content: 'yes! I hear you now' }); 復制代碼

message可以是對象也可以是字符串

這樣建立連接設置監聽后就可以和服務端通過事件進行通信了

服務端監聽到客戶端發來的消息后向該房間所有用戶廣播消息:

socket.broadcast.to(currentRoom[socket.id]).emit('message', {text: previousName + ' 現在已更名為 ' + name + '.' }); 復制代碼

結合以上描述的這些方法,就能完整搭建一個聊天室了,關于前端頁面的結構和頁面事件的邏輯我這里就不詳細說了

我把我的demo放到了github上,有興趣的同學可以看看:github.com/SailorCai/n…






總結

以上是生活随笔為你收集整理的node+socket.io 实现一个聊天室的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。