CORS 跨域问题
跨域是由于 浏览器 的 同源策略 导致的问题
请求地址的组成
例:http://www.baidu.com:80/s?keywords=图片
- http : schema,是一种协议
- www.baidu.com 是域名
- 80 : 是默认的端口,可以省略
- /s 是请求地址
- keywords=图片 请求参数
什么是同源策略?
指的是 协议相同、域名相同、端口相同
http://www.baidu.com/s
http://www.baidu.com:8000/s
https://www.baidu.com/s
http://wenku.baidu.com/s
*.baidu.com (二级域名)
跨域的解决方案
<script>
标签的跨域- jsonp 跨域,json 的原理就是
<script>
标签
后台返回的默认是一个 JSON 对象,如何让后台返回一个 JS 代码?
[1, 2, 3, 4]
{name:"zhansan", ...}
test([1, 2, 3, 4])
test({name:"zhansan", ...})
在页面上,定义一个 test 函数
jsonp 在使用的时候,要求后端必须支持,后端返回的不是一个标准的 JSON,
而是一个形似 javascript 函数的表示形式
CORS (Cross-Origin Resource Sharing)
通过 CORS: Cross-Origin Resource Sharing(跨站资源共享)策略,来实现跨域
解决方案:主要在后端服务器上、在响应的头信息上,添加一个 Access-Control-Allow-Origin = *
这样的头信息即可。
DRF 中如何解决跨域问题
DRF 是通过 django-cors-headers
来解决跨域的问题,在 DRF 中引入 django-cors-headers
的步骤如下:
pip install django-cors-headers
- 在
INSTALLED_APPS
中,添加"corsheaders"
- 在
settings.py
配置文件中,middlewares
中添加中间件corsheaders.middleware.CorsMiddleware
- 在
settings.py
中,# 配置跨域的属性 CORS_ORIGIN_ALLOW_ALL = False # 如果设置为 True,白名单失效,则允许所有的网站都可以跨域访问 # 设置跨域的白名单 CORS_ORIGIN_WHITELIST = [ 'http://www.baidu.com', 'http://www.sina.com', ]
CORS 除了在响应的头信息上设置 Access-Control-Allow-Origin 来允许某个资源进行跨域,还可以通过 反向代理 的技术进行跨域;
在反向代理的时候,需要在代理服务器上设置 Access-Control-Allow-Origin
<iframe>
标签跨域