当前位置：首页 > article >正文

信令服务器设计之websocket基础

article 2024/11/14 0:12:03

环境搭建

WebRTC 环境搭建-CSDN博客

前言

对于我们WebRTC项目而言，nodejs主要是实现信令服务器的功能，客户端和服务器端的交互我们选择websocket作为通信协议，所以该章节的实战以websocket的使用为主。 web客户端的websocket和nodejs服务器端的websocket有一定的差别，所以我们分开两部分进行讲解。

客户端

现在，很多网站为了实现推送技术，所用的技术都是 Ajax 轮询。轮询是在特定的的时间间隔（如每1秒），由浏览器对服务器发出HTTP请求，然后由服务器返回最新的数据给客户端的浏览器。这种传统的模式带来很明显的缺点，即浏览器需要不断的向服务器发出请求，然而HTTP请求可能包含较长的头部，其中真正有效的数据可能只是很小的一部分，显然这样会浪费很多的带宽等资源。

WebSocket 协议，能更好的节省服务器资源和带宽，并且能够更实时地进行通讯。

主要特点:

全双工通信:
- WebSocket 建立连接后,客户端和服务器可以在任意时刻相互发送数据,无需遵循请求-响应模式。
- 这使得它非常适合实时通信应用,如聊天、股票行情、多人游戏等。
持久连接:
- WebSocket 连接建立后会一直保持打开状态,直到一方主动关闭。
- 这与传统的 HTTP 请求-响应模式不同,HTTP 连接在一次请求后就会立即关闭。
低延迟:
- WebSocket 协议的数据帧比 HTTP 报文小,并且没有重复的 HTTP 头信息,因此传输延迟更低。
二进制数据传输:
- WebSocket 支持传输文本数据和二进制数据,非常适合传输图像、视频等多媒体内容。
跨域支持:
- WebSocket 连接建立时会自动执行跨域检查,无需额外的跨域配置。
较低的通信开销:
- WebSocket 协议头部较小,相比 HTTP 协议减少了大量的开销。

WebSocket 相比 Ajax 轮询的优势也非常正确。WebSocket 可以实现真正的实时双向通信,大大减少了网络开销和延迟。这使得 WebSocket 在实时应用领域有着广阔的应用前景。

总的来说,WebSocket 为 Web 客户端和服务器之间的通信带来了革命性的变革,必将在未来的 Web 开发中扮演越来越重要的角色。

代码示例

浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求，连接建立以后，客户端和服务器端就可以通过 TCP 连接直接交换数据。

// WebSocketClient.js

// 创建 WebSocket 连接
const webSocket = new WebSocket('ws://example.com/websocket');

// 监听 WebSocket 事件
webSocket.onopen = function() {
  console.log('WebSocket connection established.');
};

webSocket.onmessage = function(event) {
  console.log('Received message:', event.data);
};

webSocket.onclose = function() {
  console.log('WebSocket connection closed.');
};

webSocket.onerror = function(event) {
  console.error('WebSocket error:', event.data);
};

// 发送消息的函数
function sendMessage(message) {
  if (webSocket.readyState === WebSocket.OPEN) {
    webSocket.send(message);
    console.log('Sent message:', message);
  } else {
    console.error('WebSocket connection is not open.');
  }
}

// 示例使用
sendMessage('Hello, WebSocket!');

Nodejs服务器 websocket

服务器端使用websocket需要安装nodejswebsocket

 sudo  npm init -y
 sudo npm install nodejs-websocket

我们只要关注：
（1）如何创建websocket服务器，通过createServer和listen接口；
（2）如何判断有新的连接进来，createServer的回调函数判断；
（3）如何判断关闭事件，通过on("close", callback) 事件的回调函数；
（4）如何判断接收到数据，通过on("text", callkback)事件的回调函数；
（5）如何判断接收异常，通过on("error", callkback)事件的回调函数；
（6）如何主动发送数据，调用sendText

代码示例

const WebSocket = require('ws');

// 创建 WebSocket 服务器
const wss = new WebSocket.Server({ port: 8080 });

// 监听 WebSocket 连接事件
wss.on('connection', (ws) => {
  console.log('WebSocket client connected');

  // 监听消息事件
  ws.on('message', (message) => {
    console.log('Received message:', message);

    // 向所有连接的客户端广播消息
    wss.clients.forEach((client) => {
      if (client !== ws && client.readyState === WebSocket.OPEN) {
        client.send(message);
      }
    });
  });

  // 监听关闭事件
  ws.on('close', () => {
    console.log('WebSocket client disconnected');
  });

  // 监听错误事件
  ws.on('error', (error) => {
    console.error('WebSocket error:', error);
  });
});

console.log('WebSocket server started on port 8080');