webSocket

簡單實用webSocket
服務端
需要socket和express

npm install --save socket.io
npm install express--save
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

app.get('/', function(req, res){
    res.send('<h1>Welcome Realtime Server</h1>');
});

io.on('connection', function(socket){
    console.log('a user connected');
    socket.on("disconnect", function() {
        console.log("a user go out");
    });
    socket.on("message", function(obj) {
        io.emit("message", obj);
    });
});

http.listen(3000, function(){
    console.log('listening on *:3000');
});

客戶端

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>webSocket</title>
    <script src="http://127.0.0.1:3000/socket.io/socket.io.js"></script>
</head>
<body>
    <ul id="message">
        <input type="text" id="text"/>
        <input type="button" value="sub" onclick="sub()"/>
        <p>receive: <span id="receive"></span></p>
    </ul>
    <script>
        socket = io.connect('ws://127.0.0.1:3000');
        function sub(){
            let msg = document.getElementById("text").value;
            socket.emit("message", msg);
        }
        socket.on("message", function(obj) {
            document.getElementById("receive").innerHTML  = obj;
        });
    </script>
</body>
</html>

打開兩個頁面,第一個寫入后點擊按鈕提交

第一個頁面

提交后打開第二個頁面

https://github.com/littleStar123/webSocket
網上找的代碼,下次再改改

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容