现在的位置: 首页 > 综合 > 正文

MVC4 Web Api 与 Ajax交互存在的跨域问题总结

2013年03月03日 ⁄ 综合 ⁄ 共 1483字 ⁄ 字号 评论关闭

最近项目中要用到mvc4的webapi,其实就是类似webservers wcf的东东( 虽然我都没用过,但是功能和用处还是知道的)作为接口使用,webapi有个好处就是可以把实现IEnumberable接口的数据能根据请求的返回数据类型(xml或者json)自动序列化成这样结构的数据,默认情况下chrome返回的是xml,IE返回的是Json。

既然是Api肯定是要让其他程序去调用的,webapi只能通过http协议去调用,在我们的项目中是静态页面中通过Ajax去调用的。那么问题就出来了 既然是在静态页面中,肯定是用在其他项目中或者在本地了,这样的话去调用webapi就是跨域访问了,要跨域当然我们会想到jQuery的几个跨域访问的方法,例如:$.get()
$.getJSON() $.getScript() $.ajax() 其实这几个在jQuery内部调用的都是$.ajax()。实验了一下才知道用这些方法实现跨域访问必须要在url后面加一个callback=?(?也不能省,jQuery会给我们添上该是什么的,每一次都不一样,为了回调的时候知道是哪个请求发出的。当然在$.ajax()方法中也可指定jsoncallback参数,发出请求后就是?的值)才行,并且返回的时候也要加在返回值得前面。例如webapi的url是www.asss.com/api/values
那么就是www.asss.com/api/values?callback=? 后台返回json格式之前要加callback的值 如:jsoncallback+"("+json+")""    jsoncallback是callback传过去的值 json是json内容   只有这样才能跨域请求成功,否则将会有jQuery报的异常 内容为.....is not called,就是返回来的时候传过去的callback方法没有被执行。造成返回的json字符串也取不到。 虽然说前后都加callback可以跨域成功,但是webapi貌似做个很多处理,要是返回json字符串在chrome浏览器中看到的返回值竟然被加了”“在最外边,在一般的处理程序返回json就不会加引号,这样的话要在前面加上callback也不会被认出来,想到会不会有在response的时候可以处理的可继承的方法,但是没找到
好像有request时候的。

还好msdn上有个大牛给了个解决方案,链接为 http://code.msdn.microsoft.com/windowsdesktop/Implementing-CORS-support-a677ab5d还有源码下载挺好,大致意思是在跨域的ajax请求中,在request的头部加个Origin什么之类的。具体做法是建个继承
 DelegatingHandler 类的子类,重写SendAsync方法

该类内容如下:

c#代码
01 using System;
02 using System.Collections.Generic;
03 using System.Linq;
04 using System.Web;
05 using System.Net.Http;
06 using System.Threading;
07 using System.Threading.Tasks;
08 using System.Net;
09  
10  
11 namespace Mvc4WebApiTest
12 {
13     public class MessageHandler
: System.Net.Http.DelegatingHandler
14

抱歉!评论已关闭.