浏览器可以直接请求 websocket

yqcoder2024-12-18 10:26

一、原生支持

浏览器原生支持 WebSocket 协议，这使得开发者可以直接在 JavaScript 代码中使用 WebSocket 来建立与服务器的双向通信通道。

javascript 复制代码

const socket = new WebSocket("ws://localhost:8080");

socket.addEventListener("open", function (event) {

  console.log("WebSocket连接已打开");

  socket.send("你好，服务器！");

});

socket.addEventListener("message", function (event) {

  console.log("收到消息：", event.data);

});

socket.addEventListener("close", function (event) {

  console.log("WebSocket连接已关闭");

});

socket.addEventListener("error", function (event) {

  console.log("WebSocket出错：", event);

});

二、跨域考虑

不过，当 WebSocket 请求涉及跨域时，浏览器会进行安全检查。与传统的 HTTP 请求跨域类似，需要服务器正确配置跨域头信息（如`Access-Control-Allow-Origin`等）来允许跨域的 WebSocket 连接。否则，浏览器可能会阻止 WebSocket 握手，导致连接失败。

例如：如果服务器没有正确配置跨域策略，在浏览器控制台可能会看到类似"WebSocket handshake: Unexpected response code: 403"的错误信息，表示 WebSocket 握手过程中出现问题，服务器返回了禁止访问（403）的状态码。