什么是JSONP协议?
JSONP即JSON with Padding。由于同源策略的限制,XmlHttpRequest只允许请求当前源(域名、协议、端口)的资源。如果要进行跨域请求,我们可以通过使用html的script标记来进行跨域请求,并在响应中返回要执行的script代码,其中可以直接使用JSON传递javascript对象。这种跨域的通讯方式称为JSONP。
很明显,JSONP是一种脚本注入(Script Injection)行为,需要特别注意其安全性。
在asp.net中实现简单的JSONP非常简单。我们需要两个页面,分别承担协议的客户端和服务器端角色。
假设我们有两个站点,http://www.baa.com.cn 和 http://www.bitauto.com
我们的客户端页面为 http://www.baa.com.cn/JSONPClient.aspx ;而我们的服务器端页面为 http://www.bitauto.com/JSONPServer.aspx 。
首先,我们来做客户端页面:
==========Javascript代码段1:JSONP客户端发送请求的方法=================
function CallJSONPServer(url){ // 调用JSONP服务器,url为请求服务器地址
var oldScript =document.getElementById(url); // 如果页面中注册了调用的服务器,则重新调用
if(oldScript){
oldScript.setAttribute("src",url);
return;
}
var script =document.createElement("script"); // 如果未注册该服务器,则注册并请求之
script.setAttribute("type", "text/javascript");
script.setAttribute("src",url);
script.setAttribute("id", url);
document.appendChild(script);
}
------------------END------------------------
===========Javascript代码段2:JSONP客户端对服务器开放的接口方法=======================
function OnJSONPServerResponse(obj){
alert(obj);
}
------------------END------------------------
===========HTML代码段1:JSONP客户端向用户提供的UI===============
<input type="button" onclick="CallJSONPServer('http://www.bitauto.com/JSONPServer.aspx')" />
------------------END------------------------
至此,JSONP客户端完成,接下来我们做JSONP服务器端页面:
============C#代码段1:应答JSONP客户端请求================
protected void Page_Load(object sender, EventArgs e)
{
Response.DisableKernelCache();
Response.Cache.SetNoStore();
Response.Write("OnJSONPServerResponse('" + DateTime.Now.ToString() + "');");
Response.End();
}
------------------END------------------------
OK,我们现在就完成了,您不妨自己实践一下。
相关推荐
主要介绍了JSONP原理及简单实现的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下
JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。由于同源策略,一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通,而 HTML 的...
本地实现的最简单jsonp例子,本地模拟,适合初学者,让初学者更加容易理解jsonp的概念,本来想0分下载的,貌似csdn强制最低2分才能下载
交接jsonp,轻松实现跨域方法的调用,很值得学习的东西
JSONP简单调用实例。ASP.NET和纯HTML。jQuery的$.ajax的调用!jsonP说白了,就是在json字符串外面包上一个:参数名称+左右括弧!只是包了个:jsonpCallback() 而已! 相关文章:...
纯servlet实现JSONP 非常简单易懂的一个例子。
跨域_jsonp_原理,了解json的原理,等于我们掌握json的技术有帮助
JSONP原理以及示例.rar
Asp.net MVC3 实现JSONP
这篇文章是关于如何在自己的网站中实现百度搜索框的效果,所利用的是jsonp相关的知识点,所以在代码实现之前先普及一下jsonp是用来干嘛的。
主要介绍了浅析JSONP技术原理及实现 的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下
.net3.5 WCF实现jsonp,当然在.net 4.0以上就不用这样实现了。
在ajax中 JSON用来解决数据交换问题,而JSONP来实现跨域。 备注:跨域也可以通过服务器端代理来解决; 理解:JSON是一种数据交换格式,而JSONP是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互协议。 2....
jsonp的原理 jsonp的使用,使用jsonp解决js跨域问题!
jsonp 一个简单的JSONP实现。安装使用npm安装node.js或npm :$ npm install jsonp 使用component安装component(1):$ component install LearnBoost/jsonp 使用bower为浏览器安装:$ bower install jsonp原料药...
jsonp 全称是JSON with Padding,是为了解决跨域请求资源而产生的解决方案。下面让我们了解一下是如何使用的吧。
PHP AJAX JSONP实现跨域请求使用范例
cy-jsonp 实现了一个简易的 jsonp 库