首頁 > web前端 > js教程 > 主體

node.js建立簡單聊天室的方法介紹

青灯夜游
發布: 2021-02-01 11:24:07
轉載
2873 人瀏覽過

使用nodejs如何建立一個簡單聊天室?下面這篇文章跟大家介紹一下。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有幫助。

node.js建立簡單聊天室的方法介紹

相關推薦:《nodejs影片教學

剛開始學習js,本文是基於node.js和websocket實作一個簡單的線上聊天室系統(聊天群組)。

本文適合純小白閱讀。

廢話不多說,我們正式開始。

在B/S架構中,我們要得到一個數據,要向伺服器請求,然後伺服器回應。那麼如果我們客戶端不發送請求,伺服器會不會主動傳送東西給我們的客戶端(瀏覽器)呢?

答案是不會的,客戶端和伺服器透過TCP/IP協定進行連接,然後透過HTTP協定進行請求連接。而HTTP協議是一個請求—響應式的協議,而且它是一個無狀態的協議,即每一次請求—回應之間是沒有關係的。

而我們的聊天室需要什麼呢?

1.發送訊息     2.接收訊息

在接收訊息中:一個用戶端傳送訊息,伺服器接收訊息,然後

#發給另一個客戶端。

所以HTTP

滿足不了

我們的要求。這裡我們就要用到socket協定

。當伺服器與客戶端連線後,兩者都會隨時做著收發訊息的準備。

先在npm中下載socket.io模組(之前要安裝了node.js才行)。開啟cmd。

(我創建了一個node.js chat資料夾,文件都放在這裡面)

#然後開始寫我們的伺服器程式碼,建立文件server.js。

//server.js

var http = require('http');
var fs = require('fs');
var ws = require('socket.io'); //引入socket.io

var server = http.createServer(function (req, res) {
    var html = fs.readFileSync('./client.html'); 
   //client.html是发送给客户端的文件(客户端界面)

    res.end(html);
}).listen(8000);

var io = ws(server); //http服务与ws服务相关联, 返回io服务实例

//监听用户的连接事件
io.on('connection',function (socket) {      
    //发生在用户连接io服务器时
    console.log('有新用户进入房间');

    //消息发送事件
    socket.on('message',function (obj) {
       console.log(obj);
       io.emit('message',obj); //发送消息给所有客户端(广播)
    });
});
登入後複製

然後開始寫入客戶端。 ######因為我們伺服器用的是socket.io,所以在客戶端應該使用socket.io相對應的服務。此處我直接引入了一個js檔。 ######建立檔案client.html。 ###
//client.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Node.js+webSocket聊天室</title>
</head>
<body>
<h1>liky聊天室</h1>
<textarea name="" id="text" ></textarea>
<button id="btn">发送</button>

<script src="http://wulv5.com/js/socket.io.min.js"></script>
<script>
    var socket = io.connect("/"); //连接聊天室的io服务器 io服务器的根地址

    var oText = document.getElementById("text");
    var oBtn = document.getElementById("btn");

    var myMessage = "";

    oBtn.onclick = function () {
        var mes = oText.value;

        //当消息为空时
        if(!mes){
            return;
        }
        myMessage = mes;
        socket.send(mes); //发送消息到服务器
        oText.value = ""; //清空文本框
    }

    //当服务器广播消息时,触发message事件,消息内容在回调函数中
    socket.on(&#39;message&#39;,function (mm) {
        var p = document.createElement(&#39;p&#39;);
        p.innerText = mm;
        if(myMessage === mm){
            p.style.cssText = "color:red;margin-left:10%";
        }
        document.body.appendChild(p);
    })

</script>
</body>
</html>
登入後複製
###到此,程式碼部分就完成了。接下來打開cmd,運行我們的檔案。 ###############現在就可以打開瀏覽器來看看效果啦。開啟瀏覽器,訪問位址http://localhost:8000/。多打開幾個頁面來試試看效果。 ###############這樣,一個簡單的本地聊天室就完成啦。可以傳到伺服器上,就可以跟別人聊天囉(這有空我再寫一下)。 ######更多程式相關知識,請造訪:###程式設計教學###! ! ###

以上是node.js建立簡單聊天室的方法介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:csdn.net
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板