JSONP(跨域请求) —— 一种非官方跨域数据交互协议
1、JSONP的作用
由于同源策略的限制,XmlHttpRequest只允许请求当前源(域名、协议、端口)的资源,为
了实现跨域请求,可以通过script标签实现跨域请求,然后再服务器端输出JSON数据并执行回调函
数,从而解决了跨域的数据请求。
JSONP协议的一个要点:允许用户传递一个callback参数给服务器端,然后服务器端返回数据时
会将这个callback参数作为函数名来包裹住JSON数据,这样客户端就可以随意定制自己的函数来自
动处理返回函数了。
2、如何使用JSONP?
在客户端声明回调函数之后,客户端通过script标签向服务器跨域请求数据,然后服务器返回的相
应数据并动态执行回调函数
JSONP原理:
(1)首先在客户端注册一个callback,然后把callback的名字传给服务器、此时,服务器先生成
json数据
(2)然后以javascript语法的方式,放置到function中,function名字就是传递上来的参数jsonp
(3)最后将json数据直接以入参的方式,放置到function中中,这样就生成了一段js语法的文档,
返回给客户端。
eg.
<script type="text/javascript">
function jsonCallback(result){
for(var i in result){
alert(i+":"+result[i]);
}
}
var JSONP = document.createElement("script");
JSONP.type = "text/javascript";
JSONP.src = "http://crossdomain/services.php?callback=jsnopCallback";
document.getElementByTagName("head")[0].appendChild(JSONP);
</script> //或者
<script type="text/javascript" src="http://crossdomain/services.php?callback=jsnopCallback"></script>
JSONP(跨域请求) —— 一种非官方跨域数据交互协议的更多相关文章
- JSONP -- 跨域数据交互协议
一.概念 ①传统Ajax:交互的数据格式——自定义字符串或XML描述: 跨域——通过服务器端代理解决. ②如今最优方案:使用JSON格式来传输数据,使用JSONP来跨域. ③JSON:一种数据交换格式 ...
- javascript 跨域请求详细分析(终极跨域解决办法)
自从我接触前端以来,接手的项目里面很大部分都是前后端分离的,后端只提供接口,前端根据后端接口渲染出实际页面.个人觉得这是一个挺好的模式,前后端各自负责各自的模块,分工明确,而且也给前端更大的发挥空间. ...
- Ajax跨域请求附带Cookie/Ajax跨域请求附带身份凭证
一.跨域请求中默认不带cookie等验证凭证 尤其对于post请求. 对于ajax请求,其中post,get都可以正常访问. withCredentials: false, // 允许携带cookie ...
- CSRF跨站请求伪造与XSS跨域脚本攻击讨论
今天和朋友讨论网站安全问题,聊到了csrf和xss,刚开始对两者不是神明白,经过查阅与讨论,整理了如下资料,与大家分享. CSRF(Cross-site request forgery):跨站请求伪造 ...
- java 后台实现ajax post跨域请求传递json格式数据获取json数据问题
参考大神:http://blog.csdn.net/chunqiuwei/article/details/19924821 java后台: public String ajaxProxy(Intege ...
- 关于试用jquery的jsonp实现ajax跨域请求数据的问题
我们在开发过程中遇到要获取另一个系统数据时,就造成跨域问题,这就是下文要说的解决办法: 先我们熟悉下json和jsonp的区别: 使用AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交 ...
- JSON和JSONP有哪些区别,PhoneGap跨域请求如何实现
前言 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Socke ...
- Ajax的跨域请求——JSONP的使用
一.什么叫跨域 域当然是别的服务器 (说白点就是去别服务器上取东西) 只要协议.域名.端口有任何一个不同,都被当作是不同的域. 总而言之,同源策略规定,浏览器的ajax只能访问跟它的HTML页面同源( ...
- 使用Jsonp实现跨域请求
来自百度百科的一段话: JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.由于同源策略,一般来说位于 server1.exampl ...
随机推荐
- 详解Android ActionBar之二:ActionBar添加Tabs标签和下拉导航
本节主要讲解ActionBar如何添加Tabs标签和下拉导航. 一.添加标签 Tabs 在ActionBar中实现标签页可以实现android.app.ActionBar.TabListener ,重 ...
- 查看Linux主机CPU及内存信息
查看CPU信息(型号) # cat /proc/cpuinfo | grep name | cut -f2 -d: | uniq -c 8 Intel(R) Xeon(R) CPU ...
- iOS开发——新特性Swift篇&Swift 2.0 异常处理
Swift 2.0 异常处理 WWDC 2015 宣布了新的 Swift 2.0. 这次重大更新给 Swift 提供了新的异常处理方法.这篇文章会主要围绕这个方面进行讨论. 如何建造异常类型? 在 i ...
- 文件和目录之umask函数
本篇博文内容摘自<UNIX环境高级编程>(第二版),仅作个人学习记录所用.关于本书可参考:http://www.apuebook.com/. umask函数为进程设置文件模式创建屏蔽字,并 ...
- Java Annotations: Explored & Explained--转载
原文地址:http://www.javacodegeeks.com/2012/08/java-annotations-explored-explained.html One of the many w ...
- JQuery实现页面Loading效果
第一步:添加遮罩层和LOADING层 <div class="overlay"></div><div id="AjaxLoading&quo ...
- php笔记03:布尔类型,字符串,浮点数
1.布尔类型 下面情况都是看出false: 布尔类型FALSE自身 整型值为0 浮点型值为0.0 空字符串,以及字符串"0" 不包含任何元素的数组 不包含任何成员变量的对象(仅PH ...
- JS 笔记
如何定义一个函数呢?基本语法如下: function 函数名() { 函数代码; } 说明: 1. function定义函数的关键字. 2. "函数名"你为函数取的名字. ...
- JAVA_Reflection
package com.qf.reflection; import java.lang.reflect.Constructor; import java.lang.reflect.Field; imp ...
- oracle学习总结5(游标、触发器、过程、方法)
1:捕获plsql抛出的异常 declarev_ename emp.ename%type;beginselect ename into v_ename from emp where empno=10; ...