因为浏览器的同源策略限制,不是同源的脚本不能操作其他源下面的资源,想操作另一个源下面的资源就属于跨域了,这里说的跨域是广义跨域,我们常说的代码中请求跨域,是狭义的跨域,即在脚本代码中向非同源域发送http请求

浏览器的同源策略(SOP/same origin policy)是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS(跨站脚本攻击 cross site scripting)和CSRF(跨站请求伪造cross-site request forgery)等攻击。

(同源 origin:协议,域名,端口号,不清楚的话,直接在浏览器控制台中输入window.location.origin看看返回值就知道了。)

下面两种情况,是不受跨域限制的,严格来讲,这两种情况只是跨站资源请求:

  1)页面中的链接,重定向及表单提交是不受同源策略限制的

  2)跨域资源的引入,如<script src=""> <image src=""> <iframe>等

从上面的第二种情况,我们可以发现,但凡通过src去获取非同源状态的资源时,都是不受跨域限制的,那我们就可以想想,是否可以借助这种跨站资源请求的方式来实现http跨域请求呢?这就是我们接下来要说的第一种跨域解决方案:jsonp

1、JSONP(不仅限于python,所有的GET请求都可以使用jsonp实现跨域)

  1)实现原理:

    从上面的分析我们已经知道,web页面上请求跨站资源请求是不会受到同源策略限制的,所有我们会想,我们可不可以在服务器上想办法把web端需要的数据装进一个js文件里面,然后让web端直接访问这个js文件,从而获取需要的数据呢?恰巧我们知道有一种叫做json的数据格式,且js原生支持,所以web端就可以通过像访问js脚本一样的方式,来调用跨域服务器上动态生成的js文件。

    为了便于客户端使用数据,逐渐形成一种非正式传输协议:JSONP。JSONP的一个要点就是,传给服务器一个callback参数,然后服务器返回数据时,将这个callback参数作为函数名来包裹住json数据

  2)jsonp实例

    在远程服务器上新建一个remote.js文件:

    HandleRemote({"title":"哈哈", "name":"我是一个测试数据哦!"})

    在本地新建html文件:

    function HandleRemote(data){

      console.log(data.title+data.name);

    }

    <script type="text/javascript" src="远程服务器地址/remote.js">

    运行本地文件,在浏览器的控制台可以看到 哈哈我是一个测试数据哦! 的输出

    到现在我们已经实现了去服务器上获取数据,剩下还有两个问题需要我们思考:

    a、我们如何让远程服务器知道他要调用的本地函数回调函数的名字是什么?

    b、我们如何在远程服务器上动态生成js脚本

    有了思路就很好办了,先看第一个问题:

    我们如何让服务器知道我们本地的回调函数名?告诉他就行了啊,在请求中加上我们的函数名,然后让远程服务器根据我们的参数取动态生成js脚本调用函数名即可!

    前端实现

    var url = "http://test.com/getRemoteDate?callback=HandleRemote"

    var script = document.createElement("script");

    script.setAttribute("src", url)

    document.getElementByTagName("head")[0].appendChild(script);

    最后将上面的代码封装成通用的ajax形式:

    url = "http://test.com/getRemoteDate/";

    $.ajax({

      url:url,

      type:"GET",

      dataType:"JSONP",

      jsonp:"callback", #将会作为参数传给服务器,用于获得回调函数的参数名

      jsonCallback:"test", # 自定义的jsonp的回调函数参数名,默认为jQuery自动生成的函数名,也可以自定义,jQuery会自动为你处理的。

      success:function(data){

        此处data即为返回的json数据了,前端根据需要自行处理

      } 

    });

    服务端代码 :

    def getData():

      return {"title":"哈哈", "name":"这又是一个测试数据哦!"}

    def getRemote(request):

      funcName = request.GET.get("callback")

      result = getData()

      # 将结果以json形式返回,与前端的jsonp交互

      return funcName+"("+json.dumps(result)+")"

    配置url: url(r"^getRemoteData/$", getRemote)

   到这里,jsonp就完成了,虽然jsonp不受同源策略的限制,但是jsonp有个问题,就是它只支持GET请求,其他请求不支持。

2、在响应头加上响应的允许跨域的参数,告诉浏览器当前请求被服务器接受,这种跨域方式也是通用的。

  

3、python Django中最常用的另一种处理跨域的方式:

  使用Django提供的 Django-cors-headers 来处理跨域

  从GitHub上面下载Django-cors-headers

  pip install Django-cors-headers.zip

  在settings.py中的中间件中配置 【'corsheaders.middleware.CorsMiddleware',】记得这个中间件一定要写在CSRF之前,为了方便处理,一般写在最前面

  设置 CORS_ORIGIN_ALLOW_ALL = True,即允许所有的跨域请求,当然,这里也可以设置为False,然后配合 CORS_ORIGIN_WHITELIST 白名单来使用

  如此,我们的跨域处理即完成,支持所有的请求。

python 跨域处理方式的更多相关文章

  1. 基于jQuery的Jsonp跨域[Get方式]

    由于目前的项目需要无刷新的跨域操作数据,整理了下自己使用的基于jQuery的Jsonp跨域[Get方式]. 代码如下: Javascript部分 $(function(){ $.ajax({ asyn ...

  2. 跨域问题解决方式(HttpClient安全跨域 &amp; jsonp跨域)

    1 错误场景 今天要把项目部署到外网的时候,出现了这种问题, 我把两个项目放到自己本机的tomcat下, 进行代码调试, 执行 都没有问题的, 一旦把我须要调用接口的项目B放到其它的server上, ...

  3. JS跨域解决方式 window.name

    window.name 传输技术,原本是 Thomas Frank 用于解决 cookie 的一些劣势(每个域名 4 x 20 Kb 的限制.数据只能是字符串.设置和获取 cookie 语法的复杂等等 ...

  4. JavaScript跨域解决方式

    平时工作中经常被JavaScript跨域问题所困扰,其实有很多种解决方式,下面给大家介绍常用的几种: 1.jsonp解决跨域问题 客户端代码: <!DOCTYPE html> <ht ...

  5. js跨域解决方式

    什么是跨域? 概念:仅仅要协议.域名.port有不论什么一个不同,都被当作是不同的域.(所谓同源是指,域名.协议,port同样.),对于port和协议的不同,仅仅能通过后台来解决. URL 说明 是否 ...

  6. 跨域请求方式之Jsonp形式

    在浏览器端才有跨域安全限制一说,而在服务器端是没有跨域安全限制的. 在两个异构系统(开发语言不同)之间达到资源共享就需要发起一个跨域请求. 而浏览器的同源策略却限制了从一个源头的文档资源或脚本资源与来 ...

  7. [转]JS跨域解决方式 window.name

    本文转自:http://www.cnblogs.com/lichuntian/p/4909465.html window.name 传输技术,原本是 Thomas Frank 用于解决 cookie ...

  8. 前端JavaScript实现跨域的方式(转)

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

  9. js跨域请求方式 ---- JSONP原理解析

    这篇文章主要介绍了js跨域请求的5中解决方式的相关资料,需要的朋友可以参考下     跨域请求数据解决方案主要有如下解决方法:   1 2 3 4 5 JSONP方式 表单POST方式 服务器代理 H ...

随机推荐

  1. MS SQL作业Schedule的限制注意事项

      最近遇到了一个关于MS SQL作业Schedule下有限制的特殊案例,有一个作业,用户要求执行的时间为:9:30,14:30,16:30, 19:00,于是我设置了两个Schedule,其中一个每 ...

  2. peewee基本操作

    本文将简单的介绍Peewee,一览它的主要特点,主要涉及到: 模型定义 存储数据 检索数据 注意:如果你偏爱稍微高级一点的教程, peewee建立类似twitter应用 是一篇结合Flask框架与pe ...

  3. jsp笔记----97DatePicker日期插件简单使用

    <s:form action="" theme="simple"> <s:hidden name="keyword3" v ...

  4. June 18. 2018, Week 25th. Monday

    Health and cheerfulness naturally beget each other. 安康喜乐,相生相成. From Joseph Addison. Good health is a ...

  5. VS2013 创建ASP.NET MVC 4.0 未指定的错误(异常来自HRESULT: 0x80004005(e_fail))

    这个错误是真的头疼,尝试各种办法都没用,最后解决用的方法是: 找到 vs_ultimate.exe 修复文件,我的文件位置在 C:\ProgramData\Package Cache\{4d78654 ...

  6. JS DOM 实现删除和添加的功能

    <!DOCTYPE html> <html> <head> <title>发表评论</title> <link rel="s ...

  7. 【CQOI2014】危桥

    [CQOI2014]危桥 Description Alice和Bob居住在一个由N个岛屿组成的国家,岛屿被编号为\(0\)到\(N-1\).某些岛屿之间有桥相连,桥上的道路都是双向的,但是一次只能供一 ...

  8. 如何合并列表中key相同的字典?

    现有list: list1 = [{a: 123}, {a: 456},{b: 789}] 合并成: list2 = [{a: [123,456]},{b: [789]}] from collecti ...

  9. UVA 11645 - Bits(数论+计数问题)

    题目链接:11645 - Bits 题意:给定一个数字n.要求0-n的二进制形式下,连续11的个数. 思路:和 UVA 11038 这题相似,枚举中间,然后处理两边的情况. 只是本题最大的答案会超过l ...

  10. 转://工作中 Oracle 常用数据字典集锦

    DBA工作中数据字典就等同于我们本和笔,时时刻刻也分不开的,不管是看状态,还是监控,都需要数据字典的支持,本文整理出来常用的数据字典系列,帮助大家来记住和汇总以便查询利用 ALL_CATALOG Al ...