博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jQuery+ASP.NET MVC基于CORS实现带cookie的跨域ajax请求
阅读量:6093 次
发布时间:2019-06-20

本文共 2006 字,大约阅读时间需要 6 分钟。

这是今天遇到的一个实际问题,在这篇随笔中记录一下解决方法。

ASP.NET Web API提供了CORS支持,但ASP.NET MVC默认不支持,需要自己动手实现。可以写一个用于实现CORS的ActionFilterAttribute,我们就是这么实现的:

public class AllowCorsAttribute : ActionFilterAttribute{    private string[] _domains;    public AllowCorsAttribute(string domain)    {        _domains = new string[] { domain };    }    public AllowCorsAttribute(string[] domains)    {        _domains = domains;    }    public override void OnActionExecuting(ActionExecutingContext filterContext)    {        var context = filterContext.RequestContext.HttpContext;        var host = context.Request.UrlReferrer?.Host;        if (host != null && _domains.Contains(host))        {            context.Response.AddHeader("Access-Control-Allow-Origin", $"http://{host}");            context.Response.AddHeader("Access-Control-Allow-Credentials", "true");        }        base.OnActionExecuting(filterContext);    }

在需要支持CORS的Controller Action上加上[AllowCors("www.cnblogs.com")]标记。

jquery ajax的请求代码如下:

$.ajax({    url: '...',    type: 'get',    xhrFields: {        withCredentials: true    },    dataType: 'application/json; charset=utf-8',    success: function (data) {        //...    }});

【遇到的问题】

1)一开始在ajax代码中没加"withCredentials: true",发现ajax请求中没带上cookies。

2)加了"withCredentials: true"后,服务端响应出错:

XMLHttpRequest cannot load '{url}'. Credentials flag is 'true', but the 'Access-Control-Allow-Credentials' header is ''. It must be 'true' to allow credentials. Origin 'http://www.cnblogs.com' is therefore not allowed access.

后来在服务端添加了如下的响应头解决了问题:

context.Response.AddHeader("Access-Control-Allow-Credentials", "true");

3)如果是http post,ajax的请求参数中contentType不能用applicaion/json,要用application/x-www-form-urlencoded。

$.ajax({    url: 'cross domain url',    data: { reason: txtReason },    contentType: 'application/x-www-form-urlencoded; charset=utf-8',    type: 'post',    dataType: 'json',    xhrFields: {        withCredentials: true    },    success: function (data) {        //...    }});

转载于:https://www.cnblogs.com/dudu/p/5537915.html

你可能感兴趣的文章
熟练掌握doc命令下的文件操作
查看>>
Oracle中drop user和drop user cascade的区别
查看>>
【Linux】linux经常使用基本命令
查看>>
Java 内存区域和GC机制
查看>>
STL之string
查看>>
更新代码和工具,组织起来,提供所有博文(C++,2014.09)
查看>>
HTML模块化:使用HTML5 Boilerplate模板
查看>>
nginx.conf 文中描述的配置文件
查看>>
yourphp读取分类名称{$Categorys[$r[catid]]['catname']}
查看>>
百度地图插件
查看>>
ecshop广告调用方法
查看>>
矩阵及其变换、特征值与特征向量的物理意义
查看>>
登记申请汇总
查看>>
打印Ibatis最后,SQL声明
查看>>
Scala深入浅出实战经典之 List的foldLeft、foldRight、sort操作代码实战
查看>>
Google最新截屏案例详解
查看>>
2015第31周一
查看>>
2015第31周日
查看>>
在使用EF开发时候,遇到 using 语句中使用的类型必须可隐式转换为“System.IDisposable“ 这个问题。...
查看>>
PHP使用DES进行加密和解密
查看>>