websocket + node

webSocket

後端

監聽服務器: new WebSocket.server({port:30001}, () => {}) , ws.on('connection', (client)=>{})

接收信息: client.on('message', ()=>{})

發送信息: client.send()

監聽斷開連接  client.on('close)

const webSocket = require('ws');
const ws = new webSocket.Server({port:3000}, ()=> {
    console.log('socket start');
})

// 廣播:有用戶發送廣播字樣,全體線上用戶都會收到相應信息
let clients = [];
ws.on('connection', (client) => {
    clients.push(client);
    console.log(client);
    client.send('連接成功,後端接收到了前端的數據');
    client.on('message', (msg)=> {
        console.log('前端的數據:' + msg);
        // client.send('後端接收到了前端的數據' + msg);
        if(msg.indexOf('廣播') != -1) {
            sendAll()
        }
    })
    client.on('close', () => {
        console.log('前端主動關閉連接');
    })
})
function sendAll() {
    for(let i = 0; i < clients.length; i++) {
        clients[i].send('廣播廣播廣播廣播廣播廣播廣播廣播廣播廣播');
    }
}

前端

連接服務器: ws.onopen()

接收信息:   ws.onmessage = ()=>{}

發送信息:   ws.send()

斷開連接:   ws.onclose()

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
</head>
<body>
    <input type="text" id="text">
    <button οnclick="sendServer()">send server</button>
    <script>
        const ws = new WebSocket('ws://localhost:3000')
        ws.onopen = () => {
            console.log('服務器已連接');
        }
        ws.onmessage = (msg, ) => {
            // console.log(msg);
            console.log('來自服務器的數據:' + msg.data);
        }
        ws.onclose = () => {
            console.log('斷開服務器連接');
        }
        function sendServer() {
            var value = document.getElementById('text').value;
            console.log(4554);
            ws.send(value);
        }
    </script>
</body>
</html>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章