在Flask socketio应用上连接时出错

Question

我在Heroku上托管了Flask socket.io应用程序（后端）。

我的JS代码前端可以连接到本地计算机上的主机。 尝试连接到服务器时出现以下错误。

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://deploy-appp.herokuapp.com/socket.io/?

EIO=3&transport=polling&t=MH05dP-. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://deploy-appp.herokuapp.com/socket.io/?

EIO=3&transport=polling&t=MH05f5A. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

链接到后端应用程序

套接字连接的JS代码：

<script type="text/javascript">
var socket = io.connect('https://deploy-appp.herokuapp.com/');
socket.on('connect', function() {
console.log('connected');
});
socket.on('message', function(msg) {
document.getElementById('messages').append('<li>'+msg+'</li>');
console.log('Received message');
});
function send() {

console.log(document.getElementById('myMessage').value)
socket.send(document.getElementById('myMessage').value)

};
</script>

Answer 1

查看cors Wiki 。 通常，如果您的前端应用程序正在从另一个uri“运行”到后端，则会出现这样的错误。 举例来说，您的客户端代码的宿主是myclient.com，但是您的socket.io后端在anotherclient.com上运行。

有很多解决方案，您可以显式设置起源，请参见此答案Socket.io + Node.js跨域请求已阻止 。 （如果您在本地运行Web应用程序，这是最快的方法，但长期不安全）

或者，在客户端Web服务器和socketio应用程序之前有一个反向代理，该代理会将客户端/ socketio调用路由到您的socketio服务器，并将另一个请求路由到托管您的站点的服务器。