vue调用FastAPI跨域问题

最近在开发vnpy的前端app,看了一遍VeighNa的webTrader的介绍,启动web程序后,用python调试了几个API接口,都是通的,觉得用vue实现起来应该问题不大。就新建了vue项目,开搞。

结果第一个接口就把我弄懵逼了,一直提示:has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

我一直以为是vue的问题,在这条路上尝了好多解决方案,还是没解决。后来才发现原来是FastAPI的问题。

FastAPI默认是不能跨域访问的。

如果想跨域访问,需要在初始化app后,增加跨域中间件

添加引用
from fastapi.middleware.cors import CORSMiddleware
初始化 app = FastAPI() 之后添加
app.add_middleware(
CORSMiddleware,
allow_origins=[“*”],
allow_credentials=True,
allow_methods=[“*”],
allow_headers=[“*”],
)

完美搞定。

vnpy的目录是C:\veighna_studio\Lib\site-packages\vnpy_webtrader\web.py

第133行后添加这段代码,注意修改完后,要重启python运行环境。如果不知道怎么重启,重启电脑就可以了。