1,什么是CORS

​   允许浏览器向跨源(协议 + 域名 + 端口)服务器发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制

2,特点

​   1,浏览器自动完成(在请求头中加入特殊头 或 发送特殊请求)
​   2,服务器需要支持(响应头中需要有特殊头)

3,简单请求(Simple requests)和预检请求(Preflighted requests)
  满足以下全部条件的请求为简单请求
  1,请求方法如下:
​        GET or HEAD or POST
  2,请求头仅包含如下:
​      Accept
​      Accept-Language
​      Content-Language
​      Content-Type
​    3,Content-Type 仅支持如下三种:
​       application/x-www-form-urlencoded
​       multipart/form-data
​       text/plain
​    不满足以上任意一点的请求都是 预检请求

4,简单请求发送流程
  1,请求
​      请求头中 携带 Origin,该字段表明自己来自哪个域
  2,响应
​      如果请求头中的Origin在服务器接受范围内, 则返回如下头

响应头 作用 备注
Access-Control-Allow-Origin 服务器接受的域 必选
Access-Control-Allow-Credentials 是否接受Cookie 可选
Access-Control-Expose-Headers 默认情况下,xhr只能拿到如下响应头:Cache-Control,Content-Language,Content-Type,Expires,Last-Modified;如果有需要获取其他头,需在此指定 可选

  如果服务器不接受此域,则响应头中不包含 Access-Control-Allow-Origin

5,预检请求发送流程

  与前述简单请求不同,“需预检的请求”要求必须首先使用 OPTIONS方法发起一个预检请求到服务器,以获知服务器是否允许该实际请求。"预检请求“的使用,可以避免跨域请求对服务器的用户数据产生未预期的影响。
  1,OPTIONS 请求发起,携带如下请求头

请求头 作用 备注
Origin 表明此请求来自哪个域 必选
Access-Control-Request-Method 此次请求使用方法 必选
Access-Control-Request-Headers 此次请求使用的头 必选

  2,OPTIONS 接受响应阶段,携带如下响应头

响应头 作用 备注
Access-Control-Allow-Origin 同简单请求 必选
Access-Control-Allow-Methods 告诉浏览器,服务器接受得跨域请求方法 必选
Access-Control-Allow-Headers 返回所有支持的头部,当request有 ‘Access-Control-Request-Headers’时,该响应头必然回复 必选
Access-Control-Allow-Credentials 同简单请求 可选
Access-Control-Max-Age OPTION请求缓存时间,单位s 可选

  3,主请求阶段

请求头 作用 备注
Origin 表明此请求来自哪个域  必选

  

  4,主请求响应阶段  

响应头 作用 备注
Access-Control-Allow-Origin 当前服务器接受的域  必选

6,Django支持
django-cors-headers官网 https://pypi.org/project/django-cors-headers/

  1)官网下载 tar.gz结尾的安装包
  2)将源码包粘贴至虚拟机
  3)执行 tar -zxvf django-cors-headers-3.0.2.tar.gz 解压
  4) cd 到解压后的目录 cd django-cors-headers-3.0.2
  5) sudo python3 setup.py install 执行安装
  6)pip3 freeze|grep 'cors' 检查是否安装成功;若屏幕输出 django-cors-headers==3.0.2 则安装成功

配置流程

  1,INSTALLED_APPS 中添加 corsheaders
  2,MIDDLEWARE 中添加 corsheaders.middleware.CorsMiddleware
位置尽量靠前,官方建议 ‘django.middleware.common.CommonMiddleware’ 上方
  3,CORS_ORIGIN_ALLOW_ALL 布尔值 如果为True 白名单不启用
  4,CORS_ORIGIN_WHITELIST =[ 白名单
"https://example.com"
]
5, CORS_ALLOW_METHODS = (
'DELETE',
'GET',
'OPTIONS',
'PATCH',
'POST',
'PUT',
)
6, CORS_ALLOW_HEADERS = (
'accept-encoding',
'authorization',
'content-type',
'dnt',
'origin',
'user-agent',
'x-csrftoken',
'x-requested-with',
)
  7, CORS_PREFLIGHT_MAX_AGE 默认 86400s
  8, CORS_EXPOSE_HEADERS []
  9, CORS_ALLOW_CREDENTIALS 布尔值, 默认False

  7、8、9项不用配置,全部采用默认值

Django CORS跨域资源共享的更多相关文章

  1. django上课笔记7-jQuery Ajax 和 原生Ajax-伪造的Ajax-三种Ajax上传文件方法-JSONP和CORS跨域资源共享

    一.jQuery Ajax 和 原生Ajax from django.conf.urls import url from django.contrib import admin from app01 ...

  2. CORS跨域资源共享

    CORS(跨域资源共享)跨域问题及解决 当使用ajax跨域请求时,浏览器报错:XmlHttpRequest error: Origin null is not allowed by Access-Co ...

  3. CORS跨域资源共享你该知道的事儿

    "唠嗑之前,一些客套话" CORS跨域资源共享,这个话题大家一定不陌生了,吃久了大转转公众号的深度技术好文,也该吃点儿小米粥溜溜胃里的缝儿了,今天咱们就再好好屡屡CORS跨域资源共 ...

  4. 在ASP.NET Web API中实现CORS(跨域资源共享)

    默认情况下,是不允许网页从不同的域访问服务器资源的,访问遵循"同源"策略的原则. 会遇到如下的报错: XMLHttpRequest cannot load http://local ...

  5. 跨域漏洞丨JSONP和CORS跨域资源共享

    进入正文之前,我们先来解决个小问题,什么是跨域? 跨域:指的是浏览器不能执行其它网站的脚本,它是由浏览器的同源策略造成的,是浏览器的安全限制! 跨域常见的两种方式,分别是JSONP和CORS. 今天i ...

  6. 浅谈跨域问题,CORS跨域资源共享

    1,何为跨域? 在理解跨域问题之前,你先要了解同源策略和URL,简单叙述: 1)同源策略 三同:协议相同,域名相同,端口相同: 目的:保证用户信息安全,防止恶意网站窃取数据.同源策略是必须的,否则co ...

  7. Django cors跨域问题

    Django cors跨域问题 前后端分离项目中的跨域问题 即同源策略 同源策略:同源策略/SOP(Same origin policy)是一种约定,由 Netscape 公司 1995 年引入浏览器 ...

  8. Node.js实现CORS跨域资源共享

    什么是CORS CORS(Cross-origin resource sharing),跨域资源共享,是一份浏览器技术的规范,用来避开浏览器的同源策略 简单来说就是解决跨域问题的除了jsonp外的另一 ...

  9. tomcat7.0配置CORS(跨域资源共享)

    平时我们做前台页面时可能会遇到浏览器以下提示(浏览器控制台): 已阻止跨源请求:同源策略禁止读取位于 http://xxx.xxx.com 的远程资源.(原因:CORS 头缺少 'Access-Con ...

随机推荐

  1. Nodejs中request出现ESOCKETTIMEDOUT解决方案

    做需求的时候,使用Nodejs的request批量请求某一个接口,由于接口超时,出现 ESOCKETTIMEDOUT,程序中断 为了让程序遇到 ESOCKETTIMEDOUT 之后能够继续执行下去,需 ...

  2. fanc委托在项目中使用

    一,上代码 using System; namespace FuncDemo { class Program { static void Main(string[] args) { //无参数的fan ...

  3. echart 折线渐变 加柱形图结合图形,左右纵轴自设置格式,现行图北京渐变 ,x轴字体倾斜

    app.title = '折柱混合'; option = { grid: { left: '5%', //距离左边的距离 right: '5%', //距离右边的距离 top:'8%', bottom ...

  4. meter标签度量衡如何改变颜色

    此文章为转载,目的为了方便整理学习笔记. 在meter中要想改变颜色,需要用到五个值,分别是:min(最小值).max(最大值).low.high.value和optimum,其中前四个值会把整个进度 ...

  5. Tcp客户端构建流程

    tcp客户端构建流程 tcp的客户端要比服务器端简单很多,如果说服务器端是需要自己买手机.查手机卡.设置铃声.等待别人打电话流程的话,那么客户端就只需要找一个电话亭,拿起电话拨打即可,流程要少很多 示 ...

  6. Oracle11gR2 64bit+Oracle11gR2Client32bit+pl/sql 9

    安装Oracle数据库,费了老一番折腾准备软件:1. Oracle 11g R2 64bit2. Oracle 11g R2 Client 32bit3. PLSQL Developer V9 逐个安 ...

  7. 前端每日实战:32# 视频演示如何用纯 CSS 创作六边形按钮特效

    效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/xjoOeM 可交互视频教程 此视频 ...

  8. js undefined三目运算

    js ajax传值中 "id":$('#id').val(), 如果#id不存在,使用$('#id').val()||‘’,可避免向后台传入undefined

  9. Java+Maven的工程运行Sonar的方式

    step 1:在maven->setting.xml中进行配置 修改mvn工程所用的setting.xml文件,在<profiles></profiles>节点中增加: ...

  10. hdu 6143: Killer Names (2017 多校第八场 1011)

    题目链接 题意,有m种颜色,给2n个位置染色,使左边n个和右边n个没有共同的颜色. 可以先递推求出恰用i种颜色染n个位置的方案数,然后枚举两边的染色数就可以了,代码很简单. #include<b ...