在使用Socket.io进行前端跨域通信时,可以通过设置Socket.io的cors选项来允许跨域请求。
以下是一个简单的例子,展示了如何在Node.js的服务器代码中配置Socket.io以允许跨域连接:
const express = require('express');
const http = require('http');
const socketIO = require('socket.io');
// 创建一个Express应用和HTTP服务器
const app = express();
const server = http.createServer(app);
// 创建Socket.io服务器并绑定到HTTP服务器上
const io = socketIO(server, {
cors: {
origin: "http://your-frontend-domain.com", // 允许跨域的前端域名
methods: ["GET", "POST"], // 允许的跨域请求方法
transports: ['websocket', 'polling'], // 允许的跨域通信传输方式
credentials: true // 允许cookies等认证信息一起跨域传递
}
});
// 监听客户端连接
io.on('connection', (socket) => {
console.log('A client has connected');
// 定义处理消息的回调函数
socket.on('message', (data) => {
console.log('Received message:', data);
// 发送消息回客户端
socket.emit('message', 'Hello, client!');
});
// 定义处理disconnect的回调函数
socket.on('disconnect', () => {
console.log('A client has disconnected');
});
});
// 启动服务器
server.listen(3000, () => {
console.log('Server is running on port 3000');
});
前端代码使用Socket.io客户端连接到服务器:
const socket = io('http://your-backend-domain.com:3000', {
transports: ['websocket', 'polling'],
withCredentials: true
});
socket.on('connect', () => {
console.log('Connected to the server');
});
socket.on('message', (data) => {
console.log('Received message:', data);
});
// 发送消息到服务器
socket.emit('message', 'Hello, server!');
确保替换your-frontend-domain.com和your-backend-domain.com:3000为实际的前端和后端域名和端口号。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。