WebSocket的优缺点

WebSocket的优缺点

1. WebSocket概念

1.1 WebSocket优点

  1. 低延迟
  2. 全双工
  3. 长期运行
  4. 双向实时通信

1.2 什么是心跳机制

为了保持WebSocket稳定的长连接,在建立连接后,服务器和客户端之间需要通过心跳包来保持连接状态,以防止连接因长时间没有数据传输而被切断.

心跳包是一直特殊的数据包,它不包含任何实际数据,仅用来维持连接状态.

1.3 WebSocket的限制

  1. 不提供加密功能.可以使用ssl或者设置白名单
  2. 不支持老版本的浏览器
  3. 需要对长连接进行维护

2. WebSocket简单代码实现

2.1 服务端

  1. 引入http和websocket模块
  2. 创建http服务器实例
  3. 通过http创建websocket服务器
  4. 当客户端连接到websocket时,触发connection事件
    1. 接收到客户端消息触发message事件,来处理收到的消息,并通过socket.send方法向客户端发送消息.
    2. 当客户端断开连接时,触发close事件.
js 复制代码
const http = require('http');
const WebSocket = require('ws');

const server = http.createServer();
const wss = new WebSocket.Server({ server });
wss.on('connection', (socket)=>{
    console.log('ws连接已经打开!');
    socket.on('message',(message)=>{
        console.log('收到消息'+message);
        socket.send('Hola');
    });
    socket.on('close',()=> {
        console.log('ws连接已关闭');
    });
});

server.on('request',(request,response)=>{
    response.writeHead(200, {'Content-Type':'text/plain'});
    response.end('Hola');
});

server.listen(8800,()=>{
    console.log('服务器已启动,服务端口为8800');
});

2.2 客户端

  1. 创建websocket实例,给它指定服务器地址
  2. 监听websocket事件
    1. 连接打开
    2. 收到消息
    3. 连接关闭
  3. 通过按钮事件发送消息到服务器
html 复制代码
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>test-demo</title>
    </head>
    <body>
      <button onclick="sendMsg()">发送消息</button>
    </body>
    <script>
      const socket=new WebSocket("ws://localhost:8800")
      socket.onopen=function(event) {
        console.log("连接建立")
      };
      socket.onmessage=function(event){
        console.log("收到消息:"+event.data)
      };
      socket.onclose=function(event){
        console.log("连接已关闭")
      };
      function sendMsg(){
        socket.send("hello!")
      };
    </script>
</html>

2.3 访问测试

在请求头中带上了Upgrade,服务器也响应成功

当客户端点击"发消息"后,在消息中可以看到客户端发送了Hello.服务器回复了Hola

在console中也能看到服务器返回内容

相关推荐
白帽黑客沐瑶1 天前
【网络安全就业】信息安全专业的就业前景(非常详细)零基础入门到精通,收藏这篇就够了
网络·安全·web安全·计算机·程序员·编程·网络安全就业
树码小子1 天前
Java网络编程:(socket API编程:TCP协议的 socket API -- 回显程序的服务器端程序的编写)
java·网络·tcp/ip
绿箭柠檬茶1 天前
Ubuntu 服务器配置转发网络访问
服务器·网络·ubuntu
FPGA_Linuxer1 天前
FPGA 40 DAC线缆和光模块带光纤实现40G UDP差异
网络协议·fpga开发·udp
real 11 天前
传输层协议UDP
网络·网络协议·udp
路由侠内网穿透1 天前
本地部署 GPS 跟踪系统 Traccar 并实现外部访问
运维·服务器·网络·windows·tcp/ip
喵手1 天前
玩转Java网络编程:基于Socket的服务器和客户端开发!
java·服务器·网络
徐子元竟然被占了!!1 天前
实验-基本ACL
网络
ftpeak1 天前
从零开始使用 axum-server 构建 HTTP/HTTPS 服务
网络·http·https·rust·web·web app
LabVIEW开发1 天前
LabVIEW气体污染无线监测
网络·labview·labview知识·labview功能·labview程序