jsonp原理,应用场景,优缺点

jsonp的原理,应用场景,优缺点

标签： 跨域jsonp

2017-03-26 13:21 536人阅读 评论(0)收藏举报

分类：

javascript（12）

作者同类文章X

版权声明：本文为博主原创文章，未经博主允许不得转载。

目录(?)[-]

1. jsonp的原理
2. 应用场景
3. 优缺点

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

另一个域下的文档属性,这时需要进行跨域的方式进行解决,如:使用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

安全防范:

1.防止callback参数意外截断js代码,特殊字符单引号双引号,换行符存在风险.

2.防止callback参数恶意添加script标签,造成xss漏洞

3.防止跨域请求滥用,阻止非法站点恶意调用

详细请看:http://blog.csdn.net/jian_xi/article/details/66474717

顶

0

踩

0

 

 

• 上一篇JSONP与 CORS 跨域请求
• 下一篇JSONP安全防范解决方案新思路

  相关文章推荐

• • JSONP安全防范解决方案新思路
• • 简单透彻理解JSONP原理及使用
• • JsonP的使用
• • jsonp使用及总结
• • 用JSONP实现跨域请求

• • jsonp 使用简单记录（一）
• • ajax 和jsonp 不是一码事 细读详解
• • 跨域JSONP原理及调用具体示例
• • 关于JSONP的原理和JQ中使用JSONP
• • 如何使用JSONP实现跨域请求？