在建立 WebSocket Secure (WSS) 连接时,CORS 策略的处理方式与传统的 HTTP 请求有所不同。WebSocket 的连接建立是在初始的 HTTP 握手阶段完成的,因此你需要在服务器端对 WebSocket 揭示的握手请求进行适当的 CORS 配置。
如何实现
下面是一些常见的 WebSocket 服务器(例如 Node.js 和 Flask)的设置方法,以允许跨域连接。
1. Node.js (使用 ws
库)
如果你在使用 Node.js 和 ws
库,你可以通过响应 HTTP 握手请求来设置 CORS:
const WebSocket = require('ws');
const http = require('http');
const server = http.createServer((req, res) => {
// 这里可以添加你的 CORS 头部
res.setHeader('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
res.setHeader('Access-Control-Allow-Headers', 'Content-Type');
// 如果是 OPTIONS 请求,可以直接返回
if (req.method === 'OPTIONS') {
res.writeHead(204);
return res.end();
}
// 在这里处理其他 HTTP 请求...
});
const wss = new WebSocket.Server({ server });
wss.on('connection', (ws) => {
console.log('Client connected');
ws.on('message', (message) => {
console.log(`Received: ${message}`);
ws.send(`You said: ${message}`);
});
});
server.listen(8080, () => {
console.log('Server is listening on port 8080');
});
2. Python (Flask-SocketIO)
如果你在使用 Flask 和 Flask-SocketIO,你可以利用 CORS
配置来允许跨域:
from flask import Flask
from flask_socketio import SocketIO
app = Flask(__name__)
socketio = SocketIO(app, cors_allowed_origins='*') # 或者指定具体来源,如 ['https://example.com']
@app.route('/')
def index():
return 'WebSocket Server'
@socketio.on('message')
def handle_message(message):
print(f'Received message: {message}')
socketio.send(f'You said: {message}')
if __name__ == '__main__':
socketio.run(app, port=5000)
注意事项
- CORS 与 WebSockets:尽管浏览器会先执行一次 CORS 检查,但一旦 WebSocket 建立连接,后续的数据传输将不再受到同源策略限制。
- 安全性:开启所有来源 (
*
) 会带来安全隐患。在生产环境中,应尽量限制为特定可信任的来源。 - 预检请求:虽然大部分情况下,不需要针对 WebSocket 手动处理预检请求,因为它们通常只发生在实际HTTP调用中。
希望这些信息能够帮助你正确配置 WSS 的 CORS 设置!如有其他问题,请随时问我。
内容由零声教学AI助手提供,问题来源于学员提问