（20）CORS组件实现跨域请求
1. 同源请求
我们之前所写的fastapi请求，都是同源请求。也就是协议、IP和端口这三要素和当前页面一致http://127.0.0.1:8080/。下面是一个最简单的fastapi的同源请求
import uvicorn
from fastapi import FastAPI
app = FastAPI()
@app.get('/user')
async def get_user():
return {'user': 'current user'}
if __name__ == '__main__':
uvicorn.run('main:app', host='127.0.0.1', port=8080, reload=True, workers=1)
2. 跨域请求
协议、IP和端口这三个要素但凡有一个不一致，那么这次发送的请求就是跨域请求。
我们用jquery写个ajxa请求：
Title
hello world
根据代码来看，我们点击hell world，控制台会给个'user': 'current user'的响应。
测试看下：
我们发现，请求被阻止了。提示缺少
Access-Control-Allow-Origin头。
根据上节课学的中间件，我们可以给响应加个响应头：
main.py
import uvicorn
from fastapi import FastAPI, Request
app = FastAPI()
@app.middleware('http')
async def add_header(request: Request, call_next):
# 请求代码块
# 无
response = await call_next(request)
# 响应代码块
# # 设置响应头，*代表允许所有来源的跨域请求
response.headers['Access-Control-Allow-Origin'] = '*' # 或者指定IP
return response
@app.get('/user')
async def get_user():
return {'user': 'current user'}
if __name__ == '__main__':
uvicorn.run('main:app', host='127.0.0.1', port=8080, reload=True, workers=1)
这个时候，我们就可以请求到了
我们在F12里还可以另外看到自己加的响应头：
3.CORS 中间件
跨源资源共享（CORS）是一个安全特性，允许或限制网页上的资源可以被另一个域名的网页访问。在 API 开发中配置 CORS 是常见需求，尤其是当你的前端和后端部署在不同的域时。
# 配置 CORS 中间件
# 上面要导入：from fastapi.middleware.cors import CORSMiddleware
app.add_middleware(
CORSMiddleware,
allow_origins=["*"],
allow_credentials=True,
allow_methods=["GET", "POST", "PUT", "DELETE"],
allow_headers=["X-Custom-Header", "Content-Type"],
)
这个时候，就允许网页上的资源可以被另一个域名的网页访问
FastApi课程暂时结束！