【问题标题】:Access-Control-Allow-Origin header in the response must not be the wildcard '*'... Socket.io, NodeJs, ReactJs响应中的 Access-Control-Allow-Origin 标头不能是通配符 '*'... Socket.io、NodeJs、ReactJs
【发布时间】:2019-02-08 04:28:39
【问题描述】:

我是 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 应用程序中的以下代码和我的反应应用程序托管在端口 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:当请求的凭据模式为“包含”时,响应中的“Access-Control-Allow-Origin”标头的值不能是通配符“*”。因此,Origin 'http://localhost:3000' 不允许访问。 XMLHttpRequest 发起的请求的凭证模式由 withCredentials 属性控制。

请任何人帮我解决这个问题。

【问题讨论】:

  • 您的浏览器中是否有 CORS 扩展。如果是,请打开它。如果不使用这个 chrome 扩展并尝试。 [chrome.google.com/webstore/detail/moesif-origin-cors-change/…
  • 您需要使用正确的(调用)主机作为 access-control-allow-origin 的值进行响应 - 但老实说,我无法看到您的 CORS 标头是从哪里发送的
  • @anjuc - 这是非常糟糕和危险的建议

标签: javascript node.js reactjs socket.io


【解决方案1】:

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

解决方案 1

可能已经回答了类似的问题。如果这对您不起作用,请尝试解决方案 2。

这是 stackoverflow 的答案:Solution 1

解决方案 2

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

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

在你的情况下

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

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

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

【讨论】:

    猜你喜欢
    • 2018-10-09
    • 2020-09-21
    • 2019-01-16
    • 2020-01-05
    • 1970-01-01
    • 2017-06-23
    • 2020-10-24
    • 1970-01-01
    • 2020-11-27
    相关资源
    最近更新 更多