为什么控制台报Cross-Origin-Request-Blocked错误但路由实际生效？

这是浏览器CORS安全策略的工作机制导致的，核心逻辑是CORS只会限制前端JS读取跨域响应的权限，不会阻止请求发送到后端执行。
具体原理可以拆解为以下几点：

• CORS是浏览器端的安全规则，所有校验逻辑都在浏览器层面执行，服务端本身不会主动拦截跨域请求
• 你的注册请求属于符合规则的简单请求（没有自定义请求头、Content-Type为application/x-www-form-urlencoded/multipart/form-data/text/plain其中一类）时，浏览器会直接把完整的POST请求发送给Flask后端，后端正常接收参数、执行数据库写入操作后返回响应
• 浏览器收到后端响应后，会校验响应头中是否包含符合要求的Access-Control-Allow-Origin等CORS相关字段，你当前的Flask后端没有配置返回对应的CORS头，所以浏览器判定响应不合法，抛出CORS错误并屏蔽响应内容，不让React代码读取返回结果，但此时后端的写入数据库逻辑已经执行完成，所以可以看到数据已经入库
• 如果你发送的是需要预检的复杂请求（比如Content-Type为application/json的POST请求），出现该问题的原因是Flask后端虽然响应了OPTIONS预检请求但没有返回正确的CORS头，或者错误地在预检阶段就执行了业务逻辑，同样会导致业务执行完成但前端触发CORS报错

快速修复方案 #

你可以直接使用Flask官方适配的flask-cors库完成跨域配置，示例代码如下：

from flask import Flask
from flask_cors import CORS

app = Flask(__name__)
# 全局开启跨域允许，开发环境可以直接使用该配置
CORS(app)

内容的提问来源于stack exchange，提问作者filifunk