在开发测试中,难免会在不同域下进行跨域操作,出于安全性考虑,浏览器中的同源策略阻止从一个域上加载的脚本获取或者操作

另一个域下的文档属性,这时需要进行跨域的方式进行解决,如:使用jsonp ,iframe等

1.jsonp的原理

jsonp,即json+padding,动态创建script标签,利用script标签的src属性可以获取任何域下的js脚本,通过这个特性(也可以说漏洞),服务器端不在返货json格式,而是返回一段调用

某个函数的js代码,在src中进行了调用,这样实现了跨域.

2.应用场景

在网上经常看到别人的blog中在用jsonp模仿360和百度进行跨域拿数据,这两者就是典型的跨域请求案例.又比如在近期开发中前端部分用的是vue.js进行开发,所以跟后台进行交

互的时候就可以通过跨域进行通信,正好用的jsonp(折腾 一番之后,最终没有用这种方式,后面会说到),另外,qq空间大部分用的都是

jsonp.

3.优缺点

jsonp优点:
完美解决在测试或者开发中获取不同域下的数据,用户传递一个callback参数给服务端,然后服务端返回数据时会将这个callback参数作为函数名来包裹住JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回数据了。简单来说数据的格式没有发生

很大变化

jsonp缺点:

这里主要讲jsonp的缺点,也就是我上面说的没有用这个的原因

1.jsonp只支持get请求而不支持post请求,也即是说如果想传给后台一个json格式的数据,此时问题就来了,浏览器会报一个http状态码

415错误,告诉你请求格式不正确,这让我很蛋

疼(在登录注册中需要给后台传一大串数据),如果都用参数的形式拼接在url后面的话不太现实,后台取值也会显得繁琐,

2.在登录模块中需要用到session来判断当前用户的登录状态,这时候由于是跨域的原因,前后台的取到的session是不一样的,那么就不

能就行session来判断.

3.由于jsonp存在安全性问题(不知qq空间的跨域是怎么解决的,还是另有高招?)

后来考虑到上面的一系列问题,采用的是后台进行设置允许跨域请求(但还是存在缺陷的,实质上还是跨域,如上面说的session问题)

.Header set Access-Control-Allow-Origin *

为了防止XSS攻击我们的服务器, 我们可以限制域,比如

Access-Control-Allow-Origin: http://blog.csdn.net

jsonp的原理,应用场景,优缺点的更多相关文章

  1. jsonp协议原理深度解析

    前言 今天在开发联调的过程中,需要跨域的获取数据,因为使用的jquery,当然使用dataType:'jsonp'就能够很easy的解决了.但是因为当时后端没有支持jsonp来访问,后来他在实现这个功 ...

  2. js/ajax跨越访问-jsonp的原理和实例(javascript和jquery实现代码)

    最近做了一个项目,需要用子域名调用主域名下的一个现有的功能,于是想到了用jsonp来解决,在我们平常的项目中不乏有这种需求的朋友,于是记录下来以便以后查阅同时也希望能帮到大家,需要了解的朋友可以参考下 ...

  3. JSONP的原理

    JSONP的原理 JSONP的最基本的原理是:动态添加一个<script>标签,而script标签的src属性是没有跨域的限制的. <script type="text/j ...

  4. JSONP的原理与实现(基于jQuery)

    为什么会有JSONP?因为我们使用AJAX,使用AJAX可能就会遇到跨域的需求,如何解决呢,对,就是JSONP. 这里注意下JSON和JSONP不是一类,虽然他们只是一个字母只差,但是实际差别很大.这 ...

  5. jsonp实现原理

    jquery 封装在 ajax方法 里面的jsonp jsonp跨域的原理       1:使用script 标签发送请求,这个标签支持跨域访问       2:在script 标签里面给服务器端传递 ...

  6. 从原理到场景 系统讲解 PHP 缓存技术

    第1章课程介绍 此为PHP相关缓存技术的课堂,有哪些主流的缓存技术可以被使用? 第1章 课程介绍 1-1课程介绍1-2布置缓存的目的1-3合理使用缓存1-4哪些环节适合用缓存 第2章 文件类缓存 2- ...

  7. jsonp详细原理之一

    /*script标签是不存在跨域请求的,类似的还有img,background:url,link 你可以想象一下,平时的这些标签都是可以直接引入外部资源的,所以是不存在跨域问题的*/ function ...

  8. 跨域方案JSONP与CORS的各自优缺点以及应用场景

    转自 https://www.zhihu.com/question/41992168/answer/217903179 首先明确:JSONP与CORS的使用目的相同,并且都需要服务端和客户端同时支持, ...

  9. ajax 工作原理以及其优缺点

    1.什么是AJAX?AJAX全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML),是一种创建交互式网页应用的网页开发技术.它使用:使用XHTML ...

随机推荐

  1. USB之Main item, Local item和Global item 的作用范围与归类

    https://doc.micrium.com/display/OSUM50300/USB+Device+HID+Class+Overview report descriptor –> item ...

  2. javascript null vs undefined

    这个是很古老的问题了. 一直存在争议,有些人认为,很多语言没用 undefined 也活的好好,为啥要 undefined 呢. 那有了 undefined 是否还需要 null 呢 ? typesc ...

  3. table响应式设计

    table不可用flex布局和td宽度的自适应. table外层加div.mml-table设置overflow-x:auto可以添加横向滚动条.

  4. jQuery, js 验证两次输了密码的一相同

    <div class="form-group"> <label class="col-sm-2 control-label font"> ...

  5. 阿里云文件存储(NAS)助力业务系统承载双十一尖峰流量

    2018天猫双11全球狂欢节,全天成交额再次刷新纪录达到2135亿元,其中总成交额在开场后仅仅用了2分05秒即突破100亿元,峰值的交易量达到惊人的高度,背后离不开阿里云大数据计算和存储能力的支撑.在 ...

  6. 【Codeforces Beta Round #88 C】Cycle

    [Link]:http://codeforces.com/problemset/problem/117/C [Description] 问你一张图里面有没有一个三元环,有的话就输出. [Solutio ...

  7. tp5.1 模型 where多条件查询 like 查询 --多条件查询坑啊!!(tp5.1与tp5.0初始化控制器不一样)

    tp5.1与tp5.0初始化控制器不一样!!!!!!!!!! 多条件 where必须  new where() ---------------------------------------tp5.1 ...

  8. 带头节点的单链表-------C语言实现

    /***************************************************** Author:Simon_Kly Version:0.1 Date:20170520 De ...

  9. POJ3356-AGTC-dp+字符串处理

    Let x and y be two strings over some finite alphabet A. We would like to transform x into y allowing ...

  10. PAT_A1117#Eddington Number

    Source: PAT A1117 Eddington Number (25 分) Description: British astronomer Eddington liked to ride a ...