响应中的Access-Control-Allow-Origin标头不得为通配符'*'... Socket.io,NodeJs,ReactJs

时间:2018-09-03 06:30:45

标签: javascript node.js reactjs socket.io

我是 socket.io 的新手。我的NodeJs / Express服务器中有以下代码

const http = require('http');
const socketIo = require('socket.io');
const app = express();
const server = http.createServer(app);
const io = socketIo(server);

io.on('connection', socket => {
    console.log('New client connected');
    socket.on('disconnect', () => console.log('Client disconnected'));
    socket.emit('FromAPI', 'hello');
});
//My port here is 8848
app.listen(app.get('port'), () => {
    logger.log('info', `Server started at :${app.get('port')}`);
});

然后在 Client React app 中执行以下代码,而我的react应用托管在端口3000中,为http://localhost:3000

import socketIO from 'socket.io-client';
componentDidMount() {
    const endPoint = 'http://127.0.0.1:8848';
    const socket = socketIO(endPoint);
    socket.on('FromAPI', data => console.log(data));

  }

使用此代码,我在浏览器控制台上遇到以下错误:

  

polling-xhr.js:263 GET http://127.0.0.1:8848/socket.io/?EIO=3&transport=polling&t=MMT-4kl 405(不允许使用方法)   无法加载http://127.0.0.1:8848/socket.io/?EIO=3&transport=polling&t=MMT-Aso:当请求的凭据模式为“ include”时,响应中“ Access-Control-Allow-Origin”标头的值不得为通配符“ *”。因此,不允许访问来源“ http://localhost:3000”。 XMLHttpRequest发起的请求的凭据模式由withCredentials属性控制。

任何人都可以帮助我解决这个问题。

1 个答案:

答案 0 :(得分:1)

根据MDN Web Doc,您可以添加主机URL。

解决方案1 ​​

可能已经回答了类似的问题。如果那不适合您,请尝试解决方案2。

这是stackoverflow的答案:Solution 1

解决方案2

  

将可能的Access-Control-Allow-Origin值限制为一组允许的来源,要求服务器端的代码检查Origin请求标头的值,将其与允许的来源列表进行比较,然后检查Origin值在列表中,以将Access-Control-Allow-Origin值设置为与Origin值相同的值。

     

访问控制允许来源:https://abc.xyz.gi

所以就您而言

  

访问控制允许来源:https://localhost

  

访问控制允许来源:https://127.0.0.1

进一步的质量检查read more on stackeoverflow