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

WebSocket 及时通信 - 2024最新版前端秋招面试短期突击面试题【100道】

article 2024/11/9 4:09:16

WebSocket 及时通信 - 2024最新版前端秋招面试短期突击面试题【100道】 🌐

1. 你对 WebSocket 的理解是什么？

WebSocket 是一种通讯协议，提供了在单个 TCP 连接上进行全双工（双向）通信的能力。与传统的 HTTP 请求-响应模型不同，WebSocket 允许服务器主动向客户端推送消息，这使得实时应用（如即时聊天、在线游戏和实时数据更新）得以实现。

特点：

全双工通信：客户端和服务器可以同时发送和接收消息。
低延迟：建立连接后，数据可以通过 WebSocket 以更低的延迟进行交换。
减少开销：与 HTTP 相比，WebSocket 在数据传输时减少了 HTTP 头的开销，能够提高性能。

2. WebSocket 与 HTTP 的区别是什么？

特性	WebSocket	HTTP
连接方式	单个 TCP 连接保持持久连接	每次请求都是新的连接
数据传输方式	全双工通信，客户端和服务器均可随时发送消息	请求-响应模型，客户端请求，服务器响应
连接建立	通过握手（handshake）升级从 HTTP 到 WebSocket	每次请求都进行新的连接建立
消息格式	自定义格式，可以是文本或二进制数据	主要是文本格式（如 JSON 或 XML）
性能	低延迟和低开销	较高的延迟和开销

3. 如何在前端使用 WebSocket？

在前端使用 WebSocket 的基本步骤如下：

示例代码

// 创建 WebSocket 对象，指定服务器地址
const socket = new WebSocket('ws://yourserver.com/socket');

// 连接成功的回调
socket.onopen = function(event) {
    console.log('连接成功');
    // 发送消息
    socket.send('Hello, Server!');
};

// 接收消息的回调
socket.onmessage = function(event) {
    console.log('收到消息:', event.data);
};

// 连接关闭的回调
socket.onclose = function(event) {
    console.log('连接已关闭');
};

// 连接错误的回调
socket.onerror = function(error) {
    console.error('WebSocket错误:', error);
};