一 . 同源策略

  同源策略( Same origin policy ) 是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响,可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现.

  同源策略,它是由Netscape提出的一个著名的安全策略.现在所有支持JavaScript 的浏览器都会使用这个策略.所谓同源是指,域名,协议,端口相同.当一个浏览器的两个tab页中分别打开 百度和谷歌的页面,当浏览器的百度tab页执行一个脚本的时候会检查这个脚本是属于哪个页面的,即检查是否同源,只有和百度同源的脚本才会被执行。如果非同源,那么在请求数据时,浏览器会在控制台中报一个异常,提示拒绝访问。看如下示例:

  创建一个Django项目一 :

============= http://127.0.0.1:8000项目的index
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
</head>
<body> <button>ajax请求</button> <script>
$('button').click(function () { $.ajax({
url: 'http://127.0.0.1:8008/books/',
type: 'get',
success: function (res) {
console.log(res)
}
}) })
</script> </body>
</html> ============= http://127.0.0.1:8000项目的views
from django.shortcuts import render def index(request):
return render(request, 'index.html')

  创建一个Django项目二 :

============= http://127.0.0.1:8008项目的index
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
</head>
<body> <button>ajax请求</button> <script>
$('button').click(function () { $.ajax({
url: '/books/',
type: 'get',
success: function (res) {
console.log(res)
}
}) })
</script> </body>
</html> ============= http://127.0.0.1:8008项目的views
from django.shortcuts import render
from django.http import JsonResponse def index(request):
return render(request, 'index.html') def books(request):
return JsonResponse(['s2-python', 's2-java'], safe=False)

  当点击项目二的按钮时,可以正常发送并请求到数据,但是点击项目一时,控制台会报如下错误:

Access to XMLHttpRequest at 'http://127.0.0.1:8008/books/' from origin 'http://127.0.0.1:8000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

  但是注意,项目二中的访问已经发生了,说明是浏览器对非同源请求返回的结果做了拦截。

  解决方式,项目二views的books函数修改如下:

def books(request):
obj = JsonResponse(['s2-python', 's2-java'], safe=False)
obj['Access-Control-Allow-Origin'] = 'http://127.0.0.1:8000' return obj

二 . CORS

  CORS需要浏览器和服务器同时支持。目前,所有浏览器都支持该功能,IE浏览器不能低于IE10。

  整个CORS通信过程,都是浏览器自动完成,不需要用户参与。对于开发者来说,CORS通信与同源的AJAX通信没有差别,代码完全一样。浏览器一旦发现AJAX请求跨源,就会自动添加一些附加的头信息,有时还会多出一次附加的请求,但用户不会有感觉。

  因此,实现CORS通信的关键是服务器。只要服务器实现了CORS接口,就可以跨源通信。

  浏览器将CORS请求分成两类:简单请求(simple request)和非简单请求(not-so-simple request)。

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

(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

  凡是不同时满足上面两个条件,就属于非简单请求。浏览器对这两种请求的处理,是不一样的。

  简单请求和非简单请求的区别?

  - 简单请求:一次请求;

  - 非简单请求:两次请求,在发送数据之前会先发一次请求用于做“预检”,只有“预检”通过后才再发送一次请求用于数据传输;

  关于“预检”:

  - 请求方式:OPTIONS

  - “预检”其实做检查,检查如果通过则允许传输数据,检查不通过则不再发送真正想要发送的消息

  - 如何“预检”

  => 如果复杂请求是PUT等请求,则服务端需要设置允许某请求,否则“预检”不通过

  Access-Control-Request-Method

  => 如果复杂请求设置了请求头,则服务端需要设置允许某请求头,否则“预检”不通过

  Access-Control-Request-Headers

  支持跨域,简单请求:

    服务器设置响应头:Access-Control-Allow-Origin = '域名' 或 '*'

  支持跨域,复杂请求:

    由于复杂请求时,首先会发送“预检”请求,如果“预检”成功,则发送真实数据。

    - “预检”请求时,允许请求方式则需服务器设置响应头:Access-Control-Request-Method

    - “预检”请求时,允许请求头则需服务器设置响应头:Access-Control-Request-Headers

同源策略 , CORS的更多相关文章

  1. [CORS:跨域资源共享] 同源策略与JSONP

    Web API普遍采用面向资源的REST架构,将浏览器最终执行上下文的JavaScript应用Web API消费者的重要组成部分."同源策略"限制了JavaScript的跨站点调用 ...

  2. Apache2 同源策略解决方案 - 配置 CORS

    什么是同源策略 现在的浏览器大多配有同源策略(Same-Origin Policy),具体表现如下: 浏览某一网站,例如 http://www.decembercafe.org/.这个网页中的 Aja ...

  3. 关于安全性问题:(XSS,csrf,cors,jsonp,同源策略)

    关于安全性问题:(XSS,csrf,cors,jsonp,同源策略) Ajax 是无需刷新页面就能从服务器获取数据的一种方法.它的核心对象是XHR,同源策略是ajax的一种约束,它为通信设置了相同的协 ...

  4. 同源策略 & 高效调试CORS实现

    # 目录 为什么有同源策略? 需要解决的问题 CORS跨域请求方案 preflight withCredentials 附:高效.优雅地调试CORS实现 ----------------------- ...

  5. 浏览器的同源策略及CORS跨域解决方案 DRF

    一个源的定义 如果两个页面的协议,端口(如果有指定)和域名都相同,则两个页面具有相同的源. 举个例子: 下表给出了相对http://a.xyz.com/dir/page.html同源检测的示例: UR ...

  6. 同源策略jsonp和cors

    同源策略: 同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响.可以说Web是构建在同源策略基础之上 ...

  7. AJAX_违反了同源策略_就是"跨域"——jsonp 和 cors

    https 协议    默认端口号 443 http 协议    默认端口号 80 同源策略 由网景公司提出的——浏览器 的 为了浏览器安全而生 同源策略: 协议.域名.端口号    必须完全一致 违 ...

  8. 同源策略与CORS

    同源策略 同源策略是浏览器保护用户安全上网的重要措施,协议.域名.端口号三者相同即为同源. 不同源下,浏览器不允许js操作Cookie.LocalStorage.DOM等数据或页面元素,也不允许发送a ...

  9. 同源策略、CORS

    一.同源策略 同源策略(Same origin policy) 是一种约定, 它是浏览器最核心也是最基本的安全功能 , 如果缺少了同源策略, 则浏览器的正常功能可能都会受影响 , 可以说web是构建在 ...

随机推荐

  1. 课程设计之"网络考试系统"(php、Extjs)

    1.TestSystem大概结构框图 2.数据库设计(11张表) 数据库名称:db_testsystem 数据库表: tb_admin 记录题库管理员帐户信息 代码 tb_allcontent 记录随 ...

  2. SilverLight-DataBinding-DataTemplates: 三、数据绑定 DataTemplates模板的使用(求助,没有到达实例效果,求高人指点迷津)

    ylbtech-SilverLight-DataBinding-DataTemplates: 三.数据绑定 DataTemplates模板的使用 1.A, Data Templates Intro(数 ...

  3. struts2类型转换+校验

    1.action中validate()与validateXxx() 用于action执行前的校验,如果校验失败,跳到input视图, 前者校验整个Action: 后者校验该Action中的Xxx方法. ...

  4. Android设计中的尺寸问题

    Android把屏幕大小分成四种:small, normal, large, xlarge; 屏幕密度分成:low(ldpi), medium(mdpi), high(hdpi), extra hig ...

  5. django orm高级查询 F表达式和Q表达式以及分组annotate

    1.关联关系映射及查询1.1django默认开启延迟加载所有多对1和1对1如果不使用select_related(),需要会延迟加载获取到相关对象,因为延迟可能会造成n+1次查询的问题,所以便有了se ...

  6. 决策树之 C4.5

    C4.5 是对 ID3 的一个优化,它依据信息增益率来进行属性选择. 关于决策树.请參见:http://blog.csdn.net/bone_ace/article/details/46299681 ...

  7. Nginx多域名多Server反向代理配置

    Nginx强大的正则表达式支持,可以使server_name的配置变得很灵活,如果你要做多用户博客,那么每个用户拥有自己的二级域名也就很容易实现了.下面我就来说说server_name的使用吧:ser ...

  8. redis安装报错

    错误原因大概是这个: creating server tcp listening socket 127.0.0.1:6379: bind No error 解决方案如下按顺序输入如下命令就可以连接成功 ...

  9. Highcharts使用表格数据绘制图表

    Highcharts使用表格数据绘制图表 在Highcharts中,同意用户使用网页中现有的表格数据作为数据来源,然后依据该数据来源绘制图表.对于一个典型的HTML表格.当中,第一列的数据会作为x轴刻 ...

  10. 如何配置Spring Boot Tomcat

    1.概述 Spring Boot Web应用程序默认包含预配置的嵌入式Web服务器.但在某些情况下,我们要修改默认配置以满足自定义要求. 在本教程中,我们将介绍通过application.proper ...