一、客户端用JSONP请求数据

如果你想用JSONP来获得跨域的数据,WebAPI本身是不支持javascript的callback的,它返回的JSON是这样的:

{"YourSignature": "嫁人要嫁程序员,钱多话少死得早"}

然而,JSONP请求期望得到这样的JSON:

jQuery123456({"YourSignature": "嫁人要嫁程序员,钱多话少死得早"})

所以我们需要对WebAPI做拓展,让它支持这样的callback。我找到了两种办法。

自己写个Attribute,来给返回的JSON包上callback

public class JsonCallbackAttribute : ActionFilterAttribute
{
private const string CallbackQueryParameter = "callback"; public override void OnActionExecuted(HttpActionExecutedContext context)
{
var callback = string.Empty; if (IsJsonp(out callback))
{
var jsonBuilder = new StringBuilder(callback);
jsonBuilder.AppendFormat("({0})", context.Response.Content.ReadAsStringAsync().Result);
context.Response.Content = new StringContent(jsonBuilder.ToString());
}
base.OnActionExecuted(context);
} private bool IsJsonp(out string callback)
{
callback = HttpContext.Current.Request.QueryString[CallbackQueryParameter];
return !string.IsNullOrEmpty(callback);
}
}

然后在要被调用的方法前加上这个Attribute:

        [JsonCallback]
[HttpGet]
public HttpResponseMessage a()
{
string strJson = "{\"info\" : \"true\"}";
var result = new HttpResponseMessage(HttpStatusCode.OK)
{
Content = new StringContent(strJson, Encoding.UTF8, "text/plain")
};
return result;
}

非常简洁明了,但是这种方法有个缺点,就是被加了[JsonCallback]的方法,只能适用于JSONP的请求。如果你希望API能被各种场合的客户端调用,还是在服务端提供支持吧。

2. 通过自定义JsonMediaTypeFormatter实现

参见 Artech大神的文章:http://www.cnblogs.com/artech/p/cors-4-asp-net-web-api-03.html

蒋大神的文章的JsonpMediaTypeFormatter类只适合将对象传过去进行json序列化,有点弊端

支持CORS最地道的方法当然是在服务端提供支持,按官网的办法,100%成功。http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api

主要步骤是:

1. 到nuget上装一个包:http://www.nuget.org/packages/Microsoft.AspNet.WebApi.Cors/

2. 在WebApiConfig.Register方法中加入代码:

config.EnableCors();

3. 在Controller上加上Attribute:

[EnableCors(origins: "http://myclient.azurewebsites.net", headers: "*", methods: "*")]

这个域名是可以配置的,具体还请参考上面给出的官网教程。

最后,还要告诉大家一个坑,在服务端完提供支持以后,不要高兴的太早,如果你用jQuery.ajax()的方式去请求,还是会爆的:

$.ajax({
url: 'yourCORSurl',
data: '',
dataType: 'json',
type: 'GET',
contentType: 'application/json; charset=utf-8',
...
})

经过无数次爆破,终于发现,只要把dataType和contentType两个参数去掉,就肯定不会爆了!!!

ASP.NET Web API 跨域访问(CORS)要注意的地方的更多相关文章

  1. ASP.NET Web API 跨域访问(CORS)

    一.客户端用JSONP请求数据 如果你想用JSONP来获得跨域的数据,WebAPI本身是不支持javascript的callback的,它返回的JSON是这样的: {"YourSignatu ...

  2. ASP.NET Web API 跨域访问

    自定义特性 要在WebApi中实现JSONP,一种方式是实现自定义特性  http://stackoverflow.com/questions/9421312/jsonp-with-asp-net-w ...

  3. Web Api跨域访问配置及调用示例

    1.Web Api跨域访问配置. 在Web.config中的system.webServer内添加以下代码: <httpProtocol> <customHeaders> &l ...

  4. Web API 跨域访问(CORS)

    1.在web.config里把“    <remove name="OPTIONSVerbHandler" />  ”删掉. 2. 到nuget上装一个包:    ht ...

  5. asp.net web api 跨域问题

    缘起 以前在asp.net mvc时代,很少出现跨域问题 自从使用了asp.net web api + angular (1/2)之后,开始有跨域问题了. 简单普及下跨域: 我的理解是只要是前台页面与 ...

  6. asp.net web api 跨域,带cookie

    官网上有一个介绍 http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api 但是只支 ...

  7. ASP.NET web api 跨域请求

    1.学习文章:AJAX 跨域请求 - JSONP获取JSON数据 1.asp.net代码 参考文章:http://www.sxt.cn/info-2790-u-756.html (1).增加CorsH ...

  8. ASP.Net开发WebAPI跨域访问(CORS)的精简流程

    1: Web.config里有一行: <remove name="OPTIONSVerbHandler" /> 这个要删除. 2: nuget安装Microsoft.A ...

  9. web api 跨域访问

    在工程中 Install-Package Microsoft.AspNet.WebApi.Cors 在 webapiconfig.cs中 config.EnableCors(); 在 控制器中, [E ...

随机推荐

  1. 用as3.0制作一个滚动条组件

    本实例演示了实现一个滚动条基本功能的制作方法,没有添加改变皮肤,修改滚动条视框大小等功能,有兴趣的朋友可根据自己要求自行添加.使用时只需要通过以下一行代码创建滚动条组件: var myScrollba ...

  2. 用css实现在横线中间插入文字

    在一些登录或者注册界面中常常可看到,一个大框框上面的横线中有插入文字,大概示意图如下: 这种现象其实是相对位置作用的结果,可以通过相对定位,是某元素恰好出现在div的边框上. position: re ...

  3. asterisk与freepbx常用的命令

    asterisk 常用命令: 通过asterisk -r 连接我们的asterisk. 在CLI中常用的命令: sip show peers 显示所有的SIP peers(包括friends) sip ...

  4. C++11中右值引用和移动语义

    目录 左值.右值.左值引用.右值引用 右值引用和统一引用 使用右值引用,避免深拷贝,优化程序性能 std::move()移动语义 std::forward()完美转发 容器中的emplace_back ...

  5. WPF 进程间传递参数

    WPF 进程间传递参数          在软件开发中有时需要在一个软件中启动另一个软件,这时用Process.Start(“软件路径”)可以启动另一个软件.如果在这个过程中还需要传递一些参数给新启动 ...

  6. Vue中实现token验证

    前后端流程分析 前端页面进行登录操作,将用户名和密码发给服务器 服务器进行校验,通过后生成token,包含信息有密匙.uid.过期时间等,然后返回给前端 前端将token保存在本地(建议在localS ...

  7. java开学考试感想及代码

    上周四我们的第一节java课,王老师给我们进行啦开学考试,这也是上学期放假之前给我们约定好的 但是情况显然没有我想的那么好,其实我觉得这个atm系统比上届学生信息管理系统难的多,上届的话毕竟有小学期的 ...

  8. Linux进程管理四大工具ps \dstat\ top\ htop

    Linux进程管理之“四大名捕” 一.四大名捕 四大名捕,最初出现于温瑞安创作的武侠小说,是朝廷中正义力量诸葛小花的四大徒弟,四人各怀绝技,分别是轻功暗器高手“无情”.内功卓越的高手“铁手”.腿功惊人 ...

  9. Linux系统修改Mysql密码

    一.拥有原来的myql的root的密码: 方法一: 在mysql系统外,使用mysqladmin mysqladmin -u root -p password "test123" ...

  10. SpringBoot访问NoSQL和简单的Thymeleaf-Spring-Spring-boot整合

    SpringBoot访问NoSQL SpringBoot访问Redis 在pom.xml添加boot-data-redis定义 <parent> <groupId>org.sp ...