当前位置:   article > 正文

FastAPI 学习之路(三十一)CORS(跨域资源共享)_fastapi cors

fastapi cors

CORS或者 跨域资源共享 指的是浏览器中运行的前端代码与后端处于不容的源的情况。

        源是协议(http,https),域(myapp.com,localhost)以及端口(80, 443)的组合

        因此,这些都是不同的源:

                http://localhost

                https://localhost

                http://localhost:8080

即使他们都在localhost下,但是他们使用的是不同的协议或者端口,所以它们都是不同的源。

步骤 

假设你的浏览器中有一个前端运行在http://localhost:8080的服务,并且它的js正在尝试与运行在http://localhost的服务进行通信(因为我们没有指定端口,所以默认是80)

然后浏览器会向后端发送一个OPTION请求,如果后端发送适当的headers来授权来自这个不同源的通信,浏览器将允许前端的js向后端发送请求

为此,后端必须有一个 “允许访问源” 列表

在这种情况下,它必须包含 http://localhost:8080,前端才能正常访问。

通配符

当然,上面说的允许访问源的列表,也可以使用"*"(一个通配符)声明这个列表,表示全部访问都是允许的,但这仅允许某些类型的通信,不包括所有涉及凭据的内容,像Cookies以及那些使用Bearer令牌的授权headers等。

因此,为了一切都能正常工作,最好显示的指定允许的源。

我们看下FastAPI中如何使用?

 *** 你可以使用CORSMiddleware来配置它

        1. 导入CORSMiddleware

        2. 创建一个允许的源列表(由字符串组成)

        3. 将其作为【中间件】添加到你的应用中

 你也可以指定后端是否允许:

1. 凭证(授权headers,cookies等)

2. 特定的HTTP方法(POST, PUT)或者使用通配符“*”允许所有的方法

3. 特定的HTTP headers 或者使用通配符“*”允许所有的headers

 我们看代码如何实现?

  1. from fastapi import FastAPI
  2. from fastapi.middleware.cors import CORSMiddleware
  3. app = FastAPI()
  4. origins = [
  5. "http://localhost"
  6. ]
  7. app.add_middleware(
  8. CORSMiddleware,
  9. allow_origins = origins,
  10. allow_credentials = True,
  11. allow_methods = ["GET", "POST"],
  12. allow_headers = ["*"]
  13. )
  14. @app.post("/")
  15. def cors_test():
  16. return "this is testing cors"
  17. if __name__ == '__main__':
  18. import uvicorn
  19. uvicorn.run("main:app", reload=True, debug=True)

因为我们测试不涉及到跨域,所以暂时不测试,其实在实际开发中,使用起来很简单

本文内容由网友自发贡献,转载请注明出处:【wpsshop博客】
推荐阅读
相关标签
  

闽ICP备14008679号