1.什么是跨域?
来自A服务器(A源)的js,请求的目标B服务器(B源),这种请求我们就称之为“跨域请求”。
2.同源与不同源
同源:即是同源 —— 资源url的协议 + 域名 + 端口
相同 (不同原则反之)
同源情况下:
不同源情况(遵循三步走 ):
-
(1)、发送OPTIONS请求来询问目标源主机是否允许此次跨域请求
-
(2)、目标源主机响应OPTIONS请求(两种情况,一种是允许,一种是不允许)
-
(3)、当浏览器得到允许的OPTIONS响应之后,才会发送此次跨域请求。否则阻止此次跨域请求。
3.场景
3.1 项目中,我们静态服务器的js要请求动态数据,被 CORS策略所阻止了。
3.2 解决方案
step1:安装第三方拓展应用
# 虚拟环境-安装 django-cors-headers 解决跨域问题:
pip install django-cors-headers -i https://pypi.tuna.tsinghua.edu.cn/simple
step2:注册应用并添加中间件和设置白名单
INSTALLED_APPS = [
# ......
# 2、第三方拓展应用
'corsheaders',
# .....
]
MIDDLEWARE = [
# 添加一个针对OPTIONS跨域询问请求的处理中间件
'corsheaders.middleware.CorsMiddleware',
# ....
]
# CORS跨域请求白名单设置
CORS_ORIGIN_WHITELIST = [
'http://www.meiduo.site:8080'
]
CORS_ALLOW_CREDENTIALS = True # 允许携带cookie
step3:判断是否成功
前端浏览器是通过响应头中的Access-Control-Allow-Oringin
信息,来判断请求的源是否被允许跨域请求。