浏览器同源策略之JSONP、CORS

对于不同的域名，如果是requests.get(url)请求，因为没有走浏览器，所以url不受限制，可以访问。但是如果用ajax请求，就不能直接向不同域名的url请求数据，原因是浏览器限制的，所以为了绕过浏览器这种限制，就有了JSONP。具体的应用如下：

客户端：
<script>

    $.ajax({
　　　　url: 不同域名的url，
　　　　type: 'GET',
　　　　dataType: 'JSONP',
　　　　jsonp: callback,  ---------> 作用：在请求的url的后面加上?callback='list'，list作为对方的相应数据的包裹函数：
　　　　　　　　　　　　　　　　　　　　　　　　-------> HttpResponse(list(响应数据))
　　　　jsonpCallback: 'list'
　　　　
    })

</script>


请求数据的本质： 看似用了ajax请求数据，其实没有。如果把url放到HTML中的img标签、script标签，iframe标签的中的src中就不会被浏览器的同源访问限制住。所以基于这种思想，就有了JSONP的的作用本质。

在客户端做了两件事：
　　1.创建了一个script标签：<script src='不同域名的url'></script>
　　2.创建了一个函数：
　　　　<script>
　　　　　　function list(args){
　　　　　　　　对请求到的args进行处理；
　　　　　　}
　　　　</script>
对方的返回数据也必须符合一个规则：
　　func = request.GET.get('callback')
　　HttpResponse(func(数据))

注意：
　　JSONP只能发送GET请求，因为它的本质是把一个url放到src中，发送到对方，请求数据,而不能发送数据。

 CORS：

客户端：只管发送数据，不用设置其它的。

<script>

    $.ajax({
　　　　url: 不同域名的url，
　　　　type: 'POST',
　　　　data:{}，
　　　　success:function(args){
　　　　　　对响应的数据进行处理；
　　　　}
 }) </script>

远程：
 只需要设置响应头：
　　response = HttpResponse(数据)
　　response['Access-Control-Allow-Origin'] = "客户端的域名" -----> 意思是只能指定的客户端可以请求，其它的不用。
　　response['Access-Control-Allow-Origin'] = "*"  -----> 所有的请求都可以
　　return response

注意：
　　ajax发送
　　可以发送数据

基于cors的ajax请求：

　　1. 支持跨域，简单请求：HEAD、GET、POST　

　　　　简单请求：一次请求

　　2. 支持跨域，非简单请求：除了简单请求都是非简单请求

　　　　非简单请求：两次请求，在发送数据之前会先发送一次请求用于“预检”，只有“预检”通过后再发送一次请求用于数据传输。

　　

非简单请求：
客户端：

<script>

    $.ajax({
　　　　url: 不同域名的url，
　　　　type: 'PUT',
　　　　header:{'xxx':'y'},

　　　　data:{}，
　　　　success:function(args){
　　　　　　对响应的数据进行处理；
　　　　}

    })

</script>

远程：
   if request.method == "OPTIONS":
　　　　# 预检
　　　　response = HttpResponse（）
　　　　response['Access-Control-Allow-Origin'] = "*"  -----> 允许所有的客户端请求
　　　　response['Access-Control-Allow-Method'] = "PUT" ---->"预检"请求时，允许请求方式
　　　　response['Access-Control-Allow-Header'] = "xxx" ---->"预检"请求时，允许请求头

　　　　response['Access-Control-Allow-Header'] = "xxx" ---->告诉请求端可以xxx请求头

　　　　return response
　　elif request.method == "GET":
　　　　　response = HttpResponse(数据)
　　　　　response['Access-Control-Allow-Origin'] = "*"
　　　　  return response

 

转载于:https://www.cnblogs.com/guomeina/p/7681366.html