当前位置 > 首页 > Asp.net

ASP.NET中JSONP的两种实现以及其他跨域解决方案的简单实现

12/7/2012 4:25:00 PM来源:Asp.net

   jQuery中JSONP的两种实现方式:

   都很简单,所以直接上代码!

   前台代码如下:

<script type="text/javascript">
$(
function () {
alert(
"start...");

// 第一种方式
$.ajax({
type:
"get",
url:
"http://localhost:9524/Home/ProcessCallback", // 这个就是不同于当前域的一个URL地址,这里单纯演示,所以同域
dataType: "jsonp",
jsonp:
"jsonpcallback", // 指定回调函数,这里名字可以为其他任意你喜欢的,比如callback,不过必须与下一行的GET参数一致
data: "name=jxq&email=feichexia@yahoo.com.cn&jsonpcallback=?", // jsonpcallback与上面的jsonp值一致
success: function (json) {
alert(json.Name);
alert(json.Email);
}
});

// 第二种方式
$.getJSON("http://localhost:9524/Home/ProcessCallback?name=xiaoqiang&email=jxqlovejava@gmail.com&jsonpcallback=?",
function(json) {
alert(json.Name);
alert(json.Email);
}
);

alert(
"end...");
});
</script>

   后台Action代码如下:

public string ProcessCallback(string name, string email)
{
if (Request.QueryString != null)
{
string jsonpCallback = Request.QueryString["jsonpcallback"];
var user = new User
{
Name
= name,
Email
= email
};
return jsonpCallback + "(" + new JavaScriptSerializer().Serialize(user) + ")";
}

return "error";
}

   运行后就可以看到结果了。我追踪了下后台ProcessCallback代码,如下图:

   可以看到jsonCallback的值为"jQuery17104721....",它是前端传给远程服务器后台Action的。这里jQuery171..表示的是jQuery的版本,可以简单地将这个理解为JSONP类型请求回调函数,jQuery在我们每次指定Ajax请求方式为JSONP时都会生成这么一个JSONP回调函数,第一种方式下面这三行代码设定了JSONP请求方式:

dataType: "jsonp",
jsonp:
"jsonpcallback", // 指定回调函数,这里名字可以为其他任意你喜欢的,比如callback,不过必须与下一行的GET参数一致
data: "name=jxq&email=feichexia@yahoo.com.cn&jsonpcallback=?", // jsonpcallback与上面的jsonp值一致

   第二种方式则直接在GET参数后面带上jsonpcallback=?来标识。

   我们可以推断这么做以后,jQuery内部机制就帮我们绕过了浏览器的跨域访问限制,然后就可以像正常请求同域Action一样请求跨域Action了。

   最后返回的是一个函数表达式:

return jsonCallback + "(" + new JavaScriptSerializer().Serialize(user) + ")";

   这样返回给前端的就是类似这种jQuery17104721....({Name:"jxq", Email:"feichexia@yahoo.com.cn"}),它一返回到前端就会执行,得到的是一个JavaScript对象,对象有两个属性:Name和Email,所以我们可以直接调用json.Name和json.Email。

   上面return时千万别忘了圆括号,原因不多说,看看下面的例子就明白了:

var response = "{'foo' : 'bar'}";
var json = eval(response); // Invalid label
var json = eval("(" + response + ")"); // OK

   此外也可以通过动态创建Script、内嵌iframe方式实现跨域。动态创建script的简单代码如下:


  • Expression Blend - 使用Alpha Video的特效

    1/22/2007 11:48:00 AM

    Alpha Video又称透明视频处理,我尝试了一下用Expression Blend来做这个效果。比如这张截图,就是一个湖泊的背景上,叠加了一个视频文件。现在的Opacity值大约是10%。

  • 使用FxCop做代码检查和优化

    3/14/2007 1:56:00 PM

    摘要: FxCop的使用可以自动进行一些代码方面的测试,同时有帮助提高代码执行效率和学习编码规范,从而提供代码的整体质量 阅读全文 jchdong 2007-03-14 13:46 发

  • 在非ASP.NET Web Project中创建和使用MonoRail

    10/8/2007 3:56:00 PM

    摘要: 之前在网上看到不少朋友抱怨没有Web Application Project支持而无法使用MonoRail,希望此文能给予一些帮助和启示.其实官网也有给出类似的解决办法,但不是很详细.另外很

  • C#网络版斗地主——出牌算法和规则

    6/8/2009 8:46:00 PM

    源码在上一篇文章: http://www.cnblogs.com/zhubenwuzui/archive/2009/06/06/1497673.html 本文是对C#网络版斗地主的开发总

  • 也谈WCF序列化(续)

    9/3/2007 6:57:00 PM

    摘要: 本篇介绍了NetDataContractSerializer在对象序列化、反系列化过程中保证对象语义的某些特征 阅读全文 windwolf 2007-09-03 17:52 发

  • 建立类似Office 2010界面的silverlight 应用 step-1

    1/28/2010 1:28:00 PM

    阅读: 1155 评论: 9 作者: 王喆(nasa) 发表于 2010-01-28 01:31 原文链接 建立类似Office 2010界面的silverlight 应用 step-1

  • WCF分布式安全开发实践(0):文章和代码结构规划介绍

    8/12/2009 3:26:00 AM

    继 WCF分布式开发步步为赢(14):WCF安全编程--基本概念 概念介绍了简单的WCF安全编程的基本概念之后,我决定正式推出下一个系列:《WCF分布式安全开发实践》。之所以去此名,就是因为侧

  • 在单元测试时指定HttpContext的各种Path

    8/21/2009 1:18:00 PM

    摘要: 设置HttpContext中各种Path一直是个问题,因为被测试的方法可能用到各种Path中的任何一个,而各种Path之间有一定关联,如果我们完全手动设置Mock对象的话会是一个浩大的工程。

  • 恢复被格式化过的硬盘数据

    7/24/2009 12:48:00 AM

    人一旦闲下来就会搞出一些事端来。项目刚刚结束,手头没有什么特别要紧的事情要做,所以打算重装一下系统。从公司局域网安装个 window 7 RC 版,等文件拷贝结束后感觉就死机了,后来自己重启,然后重

  • C Sharp goto statement for breaking the nested loop

    4/6/2009 4:34:00 PM

    Hi, Two days back, while discussing with a friend came a small interesting (programming) situat