Question

我用nodejs创建了一个简单的应用程序来测试socketIO，我在网站的一个子域上运行服务器，而客户端（在ReactJS中）在另一个子域上。

我的服务器总是向我发送著名的错误：

在以下位置访问XMLHttpRequest 'https：///socket.io/？EIO = 3＆transport = polling＆t = MyFav6q' 来自来源“ https：//”的信息已被CORS政策阻止：否请求中存在“ Access-Control-Allow-Origin”标头资源。

我尝试了10种以上的解决方案，但它们无法正常工作，我不知道这里出了什么问题。

app.js

const cors = require("cors");
const app = require("express")();
app.use(cors());
const server = require('http').createServer(app);
const io = require('socket.io').listen(server);

io.sockets.on('connection', function (socket) {
    socket.emit('message', 'Vous êtes bien connecté !');

    socket.on('message', function (message) {
        console.log(socket.pseudo + ' me dit: ' + message);
        socket.broadcast.emit('message', socket.pseudo + " dit: "+message);
    });

    socket.on("pseudo", pseudo => {
        socket.pseudo = pseudo;
        socket.broadcast.emit('message', socket.pseudo + " s'est connecté !");
    });

    socket.on("reset-draw", data => {
        socket.broadcast.emit('reset-draw', socket.pseudo + " a reset le dessin !");
    });

    socket.on("draw-rect", data => {
        console.log(data);
        socket.broadcast.emit('draw-rect', data);
    });
});

server.listen(8100);

socketIO部分的客户端：

import socketIOClient from "socket.io-client";

[...]

componentDidMount() {
        this._context = this.refs.canvas.getContext('2d');

        const socket = socketIOClient("https://<ServerURL>");
        socket.emit('pseudo', "testing_guy");
        socket.on("reset-draw", data => {
            this._context.clearRect(0, 0, 500, 500);
            console.log(data);
        });

        socket.on("draw-rect", data => {
            this.drawRect(data);
        });
    }

Answer 1

在服务器上将origins属性设置为io。

io.origins('*')

在任何情况下，默认情况下，任何内容都是允许的：

设置允许的原点值。默认为任何允许的来源。如果未提供任何参数，则此方法返回当前值。

您还可以传递验证function

Answer 2

我需要使用主机服务器发送的IP和端口，此后，我尝试了很多事情，但只有一天后才能工作。

NodeJS + Express Cors + SocketIO = XMLHttpRequest错误

2 个答案: