这是我first.py文件。
from flask import Flask
from flask_socketio import SocketIO,send
app=Flask(__name__)
app.config['SECRET_KEY']='myscret'
socketio=SocketIO(app)
@socketio.on('message')
def handlemessage(msg):
print('Message:'+msg)
send(msg,broadcast=True)
if __name__=='__main__':
socketio.run(app,debug=True)
这是index.html文件。
<html>
<head>
<title>Chat room</title>
<script type="text/javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.4.8/socket.io.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript" >
$(document).ready(function()
{
var socket=io.connect('http://127.0.0.1:5000');
socket.on('connect',function()
{
socket.send('User has connected');
});
});
</script>
<ul id="messages"></ul>
<input type="text" id="myMessage">
<button id="sendbtn">Send</button>
</body>
</html>
但是当我运行first.py文件并在浏览器中打开index.html时，会发生以下错误。
Access to XMLHttpRequest at 'http://127.0.0.1:5000/socket.io/?EIO=3&transport=polling&t=N9J4bHD' from
origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on
the requested resource. index.html:1
GET 127.0.0.1:5000/socket.io/?EIO=3&transport=polling&t=N9J4bHD:1 Failed to load resource:
net::ERR_FAILED socket.io.min.js:2
Access to XMLHttpRequest at 'http://127.0.0.1:5000/socket.io/?
EIO=3&transport=polling&t=N9J4bQM' from origin 'null' has been blocked by CORS policy: No 'Access-
Control-Allow-Origin' header is present on the requested resource.
127.0.0.1:5000/socket.io/?EIO=3&transport=polling&t=N9J4bQM:1 Failed to load resource:
net::ERR_FAILED
Access to XMLHttpRequest at 'http://127.0.0.1:5000/socket.io/?
EIO=3&transport=polling&t=N9J4c8L' from origin 'null' has been blocked by CORS policy: No 'Access-
Control-Allow-Origin' header is present on the requested resource.
我应该怎么做才能解决此错误？请帮忙。
请按照以下步骤操作：
- 安装烧瓶-CORS模块。在终端中运行以下命令：
pip install -U flask-cors
- 导入模块：
app=Flask(__name__)
from flask_cors import CORS
- 实例化它：
CORS(app)
- 实例化
SocketIO如下所示：
socket = SocketIO(app, cors_allowed_origins="*")
- 使用如下所示的
socket装饰器：
@socket.on('message')
def handlemessage(msg):
注意：第 #4 点，应仅在开发阶段考虑。即使在开发阶段，如果您仍想缩小传入请求的范围，也可以尝试：cors_allowed_origins='null'，使用您的设置。但是，我仍然不建议在生产中这样做。在这种情况下，您可以使用托管地址相应地配置cors_allowed_origins。
我假设您正在对此进行快速测试？
您似乎有一个直接从文件系统打开的客户端文件，因此您的 Web 服务器不提供该文件。此文件正在尝试连接到 Socket.IO 服务器。默认情况下，Web 浏览器不允许跨源的连接，因此从本地托管文件(源"null"(到服务器(源"http://localhost:5000"(的连接是不可能的，除非您明确告诉 Socket.IO 服务器您允许它。
您有几种可能的解决方案：
-
从 Flask Web 服务器提供 HTML/CSS/JS 文件。为此，请将它们放在 Flask 项目的静态文件夹中，然后从其 http://localhost:5000 地址(例如 http://localhost:5000/static/index.html(打开它们。
-
配置 Flask-SocketIO 服务器的
cors_allowed_origins选项以接受来自null源的连接。