1. webSocket簡(jiǎn)介
webSocket在開(kāi)始的時(shí)候依舊使用的是http協(xié)議,只不過(guò)后面保持tcp持久鏈接,是一種全雙工通信。webSockets和http很像,它的請(qǐng)求url用的是ws、wss,對(duì)應(yīng)http、https
2. 步驟
- 初始化
npm init -y
- 安裝ws依賴(lài)
npm i --save ws
- 寫(xiě)服務(wù)器代碼
// 【server.js】
const WebSocket = require('ws'); // 創(chuàng)建剛剛生成的模塊
const wss = new WebSocket.Server({
port:3000}); // new出一個(gè)服務(wù)器實(shí)例,并指明端口
// 事件操作
wss.on('connection',ws => {
// 有人登入
console.log("進(jìn)來(lái)訪(fǎng)問(wèn)了");
ws.on("close",() => {
// 有人登出
console.log("走了,出去了");
})
})
- 服務(wù)器啟動(dòng)
node server.js
- 配置前端代碼,即告訴瀏覽器這個(gè)請(qǐng)求不要走h(yuǎn)ttp://localhost:3000而是走ws://localhost:3000
<script>
// 創(chuàng)建websocket實(shí)例
// 實(shí)際應(yīng)用中網(wǎng)址應(yīng)該用:wss://localhost:3000 因?yàn)楦踩?/span>
const ws = new WebSocket('ws://localhost:3000');
// 事件監(jiān)聽(tīng)函數(shù)
ws.addEventListener('open',() => {
console.log("連接上ws服務(wù)器了");
})
</script>
-
此時(shí)只要打開(kāi)前端頁(yè)面,服務(wù)器端的終端命令行中就會(huì)有提示信息了
文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-410852.html
-
數(shù)據(jù)傳輸功能實(shí)現(xiàn)<文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-410852.html
到了這里,關(guān)于webSocket及使用webSocket實(shí)現(xiàn)實(shí)時(shí)聊天通信的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!