一 . 同源策略

  同源策略( 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. 由内省引出JavaBean的应用

    IntroSpector-->javaBean-->特殊的java类 get和set方法 ReflectPoint pt1 = new ReflectPoint(3,5); String ...

  2. 利用iptables的NAT代理实现内网访问外网

    利用NAT代理实现内网访问外网 背景及原理 若局域网中的两台计算机只能有一台能够访问外网,而这两台计算机之间能相互通信,那么可以配置能访问外网的那台服务器实现路由器的功能,即实现其他机器的NAT转换, ...

  3. linux中find的用法

    找所在目录的文件用 find -name “file*” -print  #注意不要用加文件路径,查找文件也好用双双引号括住: 也可以 find ./ -name “file*” -print

  4. 怎样mac上安装apk到连接数据线的手机

    高大上的mac俺也用了一段时间了.不知道大家有木有同一个烦恼.曾经在win上的时候仅仅要安装了应用宝之类的手机助手.就能够双击APK,直接安装到连接数据线的手机上,非常方便哈,可是mac上不行.近期找 ...

  5. PHP中读取文件的几个方法

    整理了一下PHP中读取文件的几个方法,方便以后查阅. 1.fread string fread ( int $handle , int $length ) fread() 从 handle 指向的文件 ...

  6. jenkins构建一个python项目

    Jenkins发布后端python代码 “系统管理”“管理插件”“已安装” 检查是否有“Git plugin”和“Publish Over SSH”两个插件,如果没有,则需点击“可选插件”,找到它 ...

  7. Linux安装indicator-china-weather

    https://launchpad.net/indicator-china-weather sudo apt-get update sudo apt-get install python-appind ...

  8. VueJS计算属性: computed

    computed属性 HTML <!DOCTYPE html> <html> <head> <meta charset="utf-8"&g ...

  9. Skia构建系统与编译脚本分析

    分析下Skia的构建系统,详细编译过程參看Windows下从源代码编译Skia.这里以ninja为例来分析.运行以下三条命令就能够完毕编译: SET "GYP_GENERATORS=ninj ...

  10. PCA的数学原理Matlab演示

    关于 PCA(Principal component analysis)主成分分析.是SVD(Singular value decomposition)神秘值分析的一种特殊情况.主要用于数据降维.特征 ...