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(跨域请求) —— 一种非官方跨域数据交互协议的更多相关文章

  1. JSONP -- 跨域数据交互协议

    一.概念 ①传统Ajax:交互的数据格式——自定义字符串或XML描述: 跨域——通过服务器端代理解决. ②如今最优方案:使用JSON格式来传输数据,使用JSONP来跨域. ③JSON:一种数据交换格式 ...

  2. javascript 跨域请求详细分析(终极跨域解决办法)

    自从我接触前端以来,接手的项目里面很大部分都是前后端分离的,后端只提供接口,前端根据后端接口渲染出实际页面.个人觉得这是一个挺好的模式,前后端各自负责各自的模块,分工明确,而且也给前端更大的发挥空间. ...

  3. Ajax跨域请求附带Cookie/Ajax跨域请求附带身份凭证

    一.跨域请求中默认不带cookie等验证凭证 尤其对于post请求. 对于ajax请求,其中post,get都可以正常访问. withCredentials: false, // 允许携带cookie ...

  4. CSRF跨站请求伪造与XSS跨域脚本攻击讨论

    今天和朋友讨论网站安全问题,聊到了csrf和xss,刚开始对两者不是神明白,经过查阅与讨论,整理了如下资料,与大家分享. CSRF(Cross-site request forgery):跨站请求伪造 ...

  5. java 后台实现ajax post跨域请求传递json格式数据获取json数据问题

    参考大神:http://blog.csdn.net/chunqiuwei/article/details/19924821 java后台: public String ajaxProxy(Intege ...

  6. 关于试用jquery的jsonp实现ajax跨域请求数据的问题

    我们在开发过程中遇到要获取另一个系统数据时,就造成跨域问题,这就是下文要说的解决办法: 先我们熟悉下json和jsonp的区别: 使用AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交 ...

  7. JSON和JSONP有哪些区别,PhoneGap跨域请求如何实现

    前言 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Socke ...

  8. Ajax的跨域请求——JSONP的使用

    一.什么叫跨域 域当然是别的服务器 (说白点就是去别服务器上取东西) 只要协议.域名.端口有任何一个不同,都被当作是不同的域. 总而言之,同源策略规定,浏览器的ajax只能访问跟它的HTML页面同源( ...

  9. 使用Jsonp实现跨域请求

    来自百度百科的一段话: JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.由于同源策略,一般来说位于 server1.exampl ...

随机推荐

  1. Oracl数据库管理方面的资料(查询sga,查看oracle数据库名称sid,查看oracle数据库名称,查看表空间,修改表空间名称)

    显示Oracle sga相关信息: SQL> show sga Total System Global Area 105978600 bytes Fixed Size 453352 bytes ...

  2. 会话跟踪session cookie

    会话跟踪 会话(Session)跟踪是Web程序中常用的技术,用来跟踪用户的整个会话.常用的会话跟踪技术Cookie与Session.Cookie通过在客户端记录信息确定用户身份,Session通过在 ...

  3. 数据库性能测试---前阿里数据库团队资深DBA杨奇龙

    杨奇龙 前阿里数据库团队资深DBA 主要负责淘宝业务线,经历多次11.11,有海量业务访问DB架构设计经验. 目前就职于有赞科技DBA,负责数据库运维工作,熟悉MySQL 性能优化,故障诊断,性能压测 ...

  4. [设计模式1]--单例模式(SINGLETON)

    搞笑解释: 俺有6个漂亮的老婆,她们的老公都是我,我就是我们家里的老公Sigleton,她们只要说道“老公”,都是指的同一个人,那就是我 定义: 单例模式确保某一个类只有一个实例,而且自行实例化并向整 ...

  5. devenv.exe - Assert Failure visual studio 2010

    安装完成devexpress后启动vs提示 devenv.exe - assert failure  第一种在博客园找到的解决方案: 原因是机器上安装了framework 4.5 和4.5中文包,卸载 ...

  6. Linux系统常用命令 __转载的

    1.登录linux系统命令:login 用户名   密码: 2.注销linux系统命令:logout ; 3.在linux系统中进入windows系统(图形界面)命令:Start x; 4.关闭lin ...

  7. 实例源码--Android简单团购应用源码

      下载源码   技术要点: 1.HTTP通信技术 2.XML数据解析 3.控件的简单应用 4.源码带有非常详细的中文 注释 ...... 详细介绍: 1. HTTP通信技术 通 过HTTP通信技术, ...

  8. java_spring_实例化bean的3种方法

    //Dao类 package com.dao.bean.www; public interface PersonServiceDao { public abstract void save(); } ...

  9. Java基础知识强化之网络编程笔记11:TCP之TCP协议上传文本文件

    1. TCP协议上传文本文件(客户端上传数据到服务器端) (1)客户端(上传数据到服务端) package cn.itcast_11; import java.io.BufferedReader; i ...

  10. javascript笔记03:易犯错的比较运算

    1.比较两个值是否相等的常见运算: " //false == "" //true == " //true false == "false" ...