创建WebSocket连接时能否设置Origin请求头？是否支持自定义该字段？

核心结论 #

WebSocket连接可以设置Origin请求头，但能否手动修改取决于运行环境，你看到的“无法添加请求头”的说法并不完全准确。

具体情况说明 #

• 浏览器环境：浏览器会自动根据当前页面的源（协议+域名+端口）生成Origin头，出于同源策略的安全限制，无法手动修改或自定义这个头。比如你在http://localhost:4200页面创建WebSocket连接，浏览器会自动带上Origin: http://localhost:4200，不需要手动设置。
• 非浏览器环境（如Node.js）：使用类似ws这类WebSocket客户端库时，完全可以手动指定Origin头。示例代码如下：

const WebSocket = require('ws');

// 创建连接时通过headers配置Origin
const socket = new WebSocket('wss://your-server-url.com', {
  headers: {
    'Origin': 'http://localhost:4200'
  }
});

浏览器环境下的特殊需求处理 #

如果你的场景是必须在浏览器中模拟非当前页面源的Origin头，只能通过本地代理服务器实现：在本地启动一个代理，将WebSocket请求转发到目标服务器时，修改请求头中的Origin字段为http://localhost:4200。

内容的提问来源于stack exchange，提问作者Prema