ASP.NET MVC 实现AJAX跨域请求方法《1》
ASP.NET MVC 实现AJAX跨域请求的两种方法
通常发送AJAX请求都是在本域内完成的,也就是向本域内的某个URL发送请求,完成部分页面的刷新。但有的时候需要向其它域发送AJAX请求,完成数据的加载,例如Google。
在ASP.Net MVC 框架里实现跨域的AJAX请求有几种方式可以实现,以下就介绍常用的两种方法。
1. 发送JSONP请求
客户端:
jQuery对发送JSONP请求有很好的支持,客户端通过. ajax() 函数发送请求,其中需要制定 dataType 为“jsonp” jsonpCallback 为指定的回调函数名(如 “UpdateDiv”),也就是客户端需要定义一个UpdateDiv 函数,当请求成功后会自动调用该函数。
服务器:
ASP.NET MVC没有内置对 JSONP 请求的支持,不过使用 JsonResult 可以很方便的实现。我们只需要定义一个类(如 JsonpResult)继承自JsonResult,并重写 ExecuteResult()方法,在输出数据时,调用客户端定义的那个回调函数(这个函数必须是存在的,并且必须是全局和唯一的)。需要注意的是,在自定义的JsonpResult 里,需要设置 JsonRequestBehavior 为 AllowGet,否则会出错,因为 JSONP 请求必须是 Get 方式提交的。
代码:
客户端:
<scripttype="text/JavaScript">
functionUpdateDiv(result) {
$("#div1").html(result.ID +result.Name);
}
$(function() {
$(".btn").click(function () {
$.ajax({
type: "GET",
url:"http://localhost:50863/Home/Index2", //跨域url
dataType: "jsonp", //指定 jsonp 请求
jsonpCallback: "UpdateDiv" // 指定回调函数
});
})
})
</script>
服务端:
public class JSONPResult :JsonResult
{
public JSONPResult()
{
JsonRequestBehavior=JsonRequestBehavior.AllowGet;
}
public string Callback{get;set;}
///<summary>
///对操作结果进行处理
///</summary>
///<paramname="context"></param>
public override void ExecuteResult(ControllerContext context)
{
var httpContext = context.HttpContext;
var callBack = Callback;
if(string.IsNullOrWhiteSpace(callBack))
callBack = httpContext.Request["callback"]; //获得客户端提交的回调函数名称
// 返回客户端定义的回调函数
httpContext.Response.Write(callBack +"(");
httpContext.Response.Write(Data); //Data 是服务器返回的数据
httpContext.Response.Write(");"); //将函数输出给客户端,由客户端执行
}
}
//操作器和其它操作没什么区别,只是返回值是JsopnpResult结果
public ActionResult Index2()
{
var str = "{ID :'123', Name : 'asdsa' }";
return new JSONPResult{Data = str }; //返回 jsonp 数据,输出回调函数
}
2. 跨域资源共享
相比 JSONP 请求,跨域资源共享要简单许多,也是实现跨域 AJAX 请求的首选。
客户端:
客户端不在发送 JSONP 类型的请求,只需要发送普通的 JSON 请求即可,也不用定义回调函数,用 .success 即可。
服务端:
服务端也很简单,操作结果还是返回普通的操作结果就可以,唯一要指定的是 HTTP 报文头部的Access-Control-Allow-Origi
指定为 “*” 即可,表示该输出允许跨域实现。
跨域资源共享可以很方便的实现,不过在 IE9 还没有对该技术的支持,FireFox 就已经支持了。
代码:
客户端:
<scripttype="text/javascript">
$(function() {
$(".btn").click(function (){
$.ajax({
type:"GET",
url:"http://localhost:50863/Home/Index3", //跨域URL
dataType:"json",
success:function (result){
$("#div1").html(result.ID +result.Name);
},
error:function (XMLHttpRequest, textStatus,errorThrown) {
alert(errorThrown); // 调用本次AJAX请求时传递的options参数
}
});
})
})
</script>
服务端:
///<summary>
///跨站资源共享实现跨站AJAX请求
///</summary>
///<returns></returns>
public ActionResult Index3()
{
var str = new { ID="123", Name= "asdsa" };
HttpContext.Response.AppendHeader("Access-Control-Allow-Origin","*");
return Json(str, JsonRequestBehavior.AllowGet);
}
ASP.NET MVC 实现AJAX跨域请求方法《1》的更多相关文章
- ASP.NET MVC 实现 AJAX 跨域请求
ASP.NET MVC 实现AJAX跨域请求的两种方法 和大家分享下Ajax 跨域的经验,之前也找了好多资料,但是都不行,后来看到个可行的修改了并测试下 果然OK了 希望对大家有所帮助! 通常发送 ...
- ASP.NET MVC 实现AJAX跨域请求的两种方法
通常发送AJAX请求都是在本域内完成的,也就是向本域内的某个URL发送请求,完成部分页面的刷新.但有的时候需要向其它域发送AJAX请求,完成数据的加载,例如Google. 在ASP.NET MVC 框 ...
- ASP.NET MVC 开启AJAX跨域请求
<system.webServer> <httpProtocol> <customHeaders> <add name="Access-Contro ...
- 基于.Net Framework 4.0 Web API开发(5):ASP.NET Web APIs AJAX 跨域请求解决办法(CORS实现)
概述: ASP.NET Web API 的好用使用过的都知道,没有复杂的配置文件,一个简单的ApiController加上需要的Action就能工作.但是在使用API的时候总会遇到跨域请求的问题,特 ...
- 【转载】ASP.NET MVC设置允许跨域访问
默认情况下,浏览器端发送Ajax请求一般被禁止跨域访问,如A域名网站访问B域名网站的请求会被终止,在ASP.NET MVC项目中,我们可以配置相应的设置项,允许网站的接口跨域访问,主要需要设置Acce ...
- ASP.NET MVC中设置跨域
ASP.NET MVC中设置跨域 1.什么是跨域请求 js禁止向不是当前域名的网站发起一次ajax请求,即使成功respone了数据,但是你的js仍然会报错.这是JS的同源策略限制,JS控制的并不是我 ...
- .Net Ajax跨域请求总结
导语 之前写过一篇文章Ajax跨域请求COOKIE无法带上的解决办法,这两天正好好好的查了一下相关知识,做来总结一下 一.传统 ajax跨域访问是一个老问题了,解决方法很多,比较常用的是JSONP方法 ...
- js基础 js自执行函数、调用递归函数、圆括号运算符、函数声明的提升 js 布尔值 ASP.NET MVC中设置跨域
js基础 目录 javascript基础 ESMAScript数据类型 DOM JS常用方法 回到顶部 javascript基础 常说的js包括三个部分:dom(文档document).bom(浏览器 ...
- jquery ajax跨域请求详解
本文章来给大家详细jquery中的ajax跨域请求, 在JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式.分别是JQuery的jquery.ajax jsonp格式和jque ...
随机推荐
- 3-HOP: A High-Compression Indexing Scheme for Reachability Query
title: 3-HOP: A High-Compression Indexing Scheme for Reachability Query venue: SIGMOD'09 author: Ruo ...
- JS正则截取两个字符串之间的字符串
match方法 var str = "iid0000ffr"; var substr = str.match(/id(\S*)ff/); console.log(substr) 返 ...
- [MySQL5.6 新特性] 全局事务标示符(GTID)
GTID的全称为 global transaction identifier , 可以翻译为全局事务标示符,GTID在原始master上的事务提交时被创建.GTID需要在全局的主-备拓扑结构中保持唯 ...
- Sql Server Analysis Service 转换为UnknownMember的正确设置 (转载)
转载: http://www.cnblogs.com/OpenCoder/p/4754447.html#commentform 在SSAS中事实表数据被归类到为UnknownMember 的时候分为两 ...
- why happen "WaitHandles must be less than or equal to 64"
一.背景: 在一个项目中碰到大数据插入的问题,一次性插入20万条数据(SQL Server),并用200个线程去执行,计算需要花费多少时间,因此需要等200个线程处理完成后,记录花费的时间,需要考虑的 ...
- 12、Java中的接口
接口:初期理解,可以认为是一个特殊的抽象类 当抽象类中的方法都是抽象的,那么该类可以通过接口的形式来表示.class用于定义类interface 用于定义接口. 接口定义时,格式特点:1,接口中常见定 ...
- 承接Hololens内容定制外包
近日,微软宣布第三批微软Hololens开发者版开始发货,包括:头显.头显手提包和一个遥控器.前两批开发者版本分别在今年3月30日和5月9日开始发货的. 第三批AR头显Hololens开发者版发货 虽 ...
- Hibernate5.2之反向工程
Hibernate5.2之反向工程 一.描述 可能很多人在使用Hibernate进行项目开发 ...
- 深入详解DataTable
在学习DataTable知识之前,我们有必要了解下ADO.NET.以下摘自MSDN: ADO.NET 对 Microsoft SQL Server 和 XML 等数据源以及通过 OLE DB 和 XM ...
- OAF_开发系列17_实现OAF数组应用Vector / Hashmap / Hashtable / Arraylist(案例)
20150506 Created By BaoXinjian