CORS实现模型有哪些

本篇内容介绍了“CORS实现模型有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

成都创新互联公司专业成都做网站、网站建设,集网站策划、网站设计、网站制作于一体,网站seo、网站优化、网站营销、软文推广等专业人才根据搜索规律编程设计,让网站在运行后,在搜索中有好的表现,专业设计制作为您带来效益的网站!让网站建设为您创造效益。

CORS 实现两种模型

1.1

简单模型

支持 get/post/put/delete 请求,例如返回 Access-Control-Allow-Origin:*,但是不允许自定义 header 且会忽略 cookies,且 post 数据格式有限制,只支持 ‘text/plain', 'application/x-www-urlencoded'and'multipart/form-data',其中’text/plain'默认支持,后面两种需要下面的预检请求和服务器协商。

1.2

协商模型/预检请求(Preflighted Request)

举例:浏览器发出 PUT 请求,OPTION 请求返回 Access-Control-Allow-Origin: 允许浏览器的脚本执行服务器返回的数据。

跨域资源共享标准新增了一组 HTTP 首部字段,允许服务器声明哪些源站通过浏览器有权限访问哪些资源。另外,规范要求,对那些可能对服务器数据产生副作用的 HTTP 请求方法(特别是 GET 以外的 HTTP 请求,或者搭配某些 MIME 类型的 POST 请求),浏览器必须首先使用 OPTIONS 方法发起一个预检请求(preflight request),从而获知服务端是否允许该跨域请求。服务器确认允许之后,才发起实际的 HTTP 请求。在预检请求的返回中,服务器端也可以通知客户端,是否需要携带身份凭证(包括 Cookies 和 HTTP 认证相关数据)。

2

FastAPI 利用 CORSMiddleware 中间件来实现 CORS。

2.1

使用 CORSMiddleware

我们通过以下流程在 FastAPI 应用中使用 CORSMiddleware
1、导入 CORSMiddleware
2、创建允许的 origins 列表
3、在应用中引入 CORSMiddleware 中间件
4、鉴权信息(Authorization headers, Cookies 等)
5、支持的 HTTP 方法(POST,GET,或者所有"")

from fastapi import FastAPIfrom fastapi.middleware.cors import CORSMiddleware
app = FastAPI()
origins = [    "http://127.0.0.1",    "https://www.baidu.com",    "https://www.hao123.com",    "http://localhost:8080",]
app.add_middleware(    CORSMiddleware,    allow_origins=origins,    allow_credentials=True,    allow_methods=["*"],    allow_headers=["*"],)

@app.get("/")async def main():    return {"message": "Hello World,"}

2.2

CORSMiddleware 解析

CORSMiddleware 的参数默认值是受限制的,为了在跨域访问中支持相应的功能,我们应当显示指定具体参数的的信息。CORSMiddleware 支持参数信息如下:
1、allow_origins:允许跨域请求的域名列表,例如 ['https://example.org ', 'https://www.example.org'] 或者 ['']
2、allow_origin_regex:允许允许跨域请求的域名正则表达式,例如 'https://..example.org'
3、allow_methods:允许跨域请求的 HTTP 方法列表,默认为['GET'],[''] 表示允许所有 HTTP 方法

4、allow_headers:跨域请求支持的 HTTP 头信息列表。['']表示允许所有头信息。Accept, Accept-Language, Content-Language 和 Content-Type 头信息默认全都支持

5、allow_credentials:表示在跨域请求时是否支持 cookie,默认为 False

6、expose_headers:表示对浏览器可见的返回结果头信息,默认为[]
7、max_age:浏览器缓存 CORS 返回结果的最大时长,默认为 600 (单位秒)

3

请求种类

浏览器将 CORS 请求分成两类:简单请求(Simple requests)和非简单请求,也叫预检请求(CORS preflight requests)。

3.1

简单请求与非简单请求界定

只要同时满足以下两大条件,就属于简单请求。

1.请求方法是以下三种方法之一:HEAD、GET 、POST

2.HTTP 的头信息不超出以下几种字段:Accept
Accept-Language
Content-Language
Last-Event-ID
Content-Type:只限于三个值 application/x-www-form-urlencoded、multipart/form-data、text/plain 凡是不同时满足上面两个条件,就属于非简单请求。

3.2

浏览区处理两种请求的区别

1、简单请求对于简单请求,浏览器直接发出 CORS 请求。具体来说,就是在头信息之中,增加一个 Origin 字段。Origin 字段用来说明,本次请求来自哪个源(协议 + 域名 + 端口)。服务器根据这个值,决定是否同意这次请求。在这种情况下,中间件会正常传递请求信息,但会在返回结果中包含恰当的 CORS 头信息。

2、预检请求非简单请求是那种对服务器有特殊要求的请求,比如请求方法是 PUT 或DELETE ,或者 Content-Type 字段的类型是 application/json。

非简单请求的 CORS 请求,会在正式通信之前,增加一次 HTTP 查询请求,称为"预检"请求(preflight)。

浏览器先询问服务器,当前网页所在的域名是否在服务器的许可名单之中,以及可以使用哪些 HTTP 方法和头信息字段。只有得到肯定答复,浏览器才会发出正式的请求,否则就报错。

"预检"请求用的请求方法是 OPTIONS,表示这个请求是用来询问的。头信息里面,关键字段是 Origin,表示请求来自哪个源。

除了 Origin 字段,"预检"请求的头信息包括两个特殊字段。

1.Access-Control-Request-Method 该字段是必须的,用来列出浏览器的 CORS 请求会用到哪些 HTTP 方法,上例是 PUT 。

2.Access-Control-Request-Headers 该字段是一个逗号分隔的字符串,指定浏览器 CORS 请求会额外发送的头信息字段,上例是 X-Custom-Header。服务器收到"预检"请求以后,检查了 Origin、Access-Control-Request-Method 和 Access-Control-Request-Headers 字段以后,确认是否允许跨源请求,就可以做出回应。

在这种情况下,中间件会拦截请求信息并且根据是否允许跨域请求返回不同的请求结果信息。

4

与 JSONP 的比较

CORS 与 JSONP 的使用目的相同,但是比 JSONP 更强大。JSONP 只支持 GET 请求,CORS 支持所有类型的 HTTP 请求。JSONP 的优势在于支持老式浏览器,以及可以向不支持 CORS 的网站请求数据。

5

CORS 总结:

1.给出 CORS 的定义
2.在 fastapi 中如何使用 CORSMiddleware 中间件实现 CORS
3.给出 CORS 与 JSONP 的比较

“CORS实现模型有哪些”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注创新互联网站,小编将为大家输出更多高质量的实用文章!


分享文章:CORS实现模型有哪些
网站URL:http://csdahua.cn/article/giocij.html
扫二维码与项目经理沟通

我们在微信上24小时期待你的声音

解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流