ASP.Net WebAPI与Ajax进行跨域数据交互时Cookies数据的传递
前言
最近公司项目进行架构调整,由原来的三层架构改进升级到微服务架构(准确的说是服务化,还没完全做到微的程度,颗粒度没那么细),遵循RESTFull规范,使前后端完全分离,实现大前端思想。由于是初次尝试,中途也遇到了不少问题。今天就来讨论一下其中之一的问题,WebAPI与前端Ajax 进行跨域数据交互时,由于都在不同的二级域名下(一级域名相同),导致Cookies数据无法获取。
最开始通过头部(Header)将Cookies传输到其WebAPI,也能解决问题。
下面讲述另外一种解决方案。
解决过程:
步骤一:将Cookies的Domain(域)设置成一级域名,例如:“.wbl.com”(a.wbl.com域名下)
这是前提,此时在其中一个WebAPI中设置了Cookies后,用浏览器直接访问其它的WebAPI是可以获取到Cookies的。例如:a.wbl.com域名下设置的Cookies,用浏览器直接访问b.wbl.com域名的WebAPI是可以获取到Cookies的。但是用c.web.com域名下的Ajax访问b.wbl.com时,就无法获取到Cookies了,这是由于浏览器中Ajax的权限相对较低,Ajax无法跨域问题导致。
写入Cookies代码:
/// <summary> /// 给指定的 Cookies 赋值 /// </summary> /// <param name="cookKey">Cookies 名称</param> /// <param name="value">Cookies 值</param> /// <param name="domain">设置与此 Cookies 关联的域(如:“.tpy100.com”)(可以使该域名下的二级域名访问)</param> public static void SetCookiesValue(string cookKey, string value, string domain) { HttpCookie cookie = new HttpCookie(cookKey); cookie.Value = value; cookie.HttpOnly = true; if (!string.IsNullOrEmpty(domain) && domain.Length > 0) cookie.Domain = domain; HttpContext.Current.Response.Cookies.Add(cookie); }
步骤二:JQuery中Ajax使用Jsonp数据类型解决跨域问题(c.wbl.com域名下)
前后端需要定义统一的回调(Callback)函数名。
前端Ajax代码:
// 设置Cookies function set() { var url = "http://a.wbl.com/api/setvalue/888888"; $.ajax({ type: "get", url: url, dataType: "jsonp", jsonp: "callbackparam", //服务端用于接收callback调用的function名的参数 jsonpCallback: "success_jsonpCallback", //callback的function名称 success: function (json) { console.log(json); alert(json); }, error: function () { alert('fail'); } }); } // 获取Cookies function get() { var url = "http://b.wbl.com/api/getvalue"; $.ajax({ type: "get", url: url, dataType: "jsonp", jsonp: "callbackparam", //服务端用于接收callback调用的function名的参数 jsonpCallback: "success_jsonpCallback", //callback的function名称 success: function (json) { console.log(json); alert(json); }, error: function () { alert('fail'); } }); }
步骤三:WebAPI中返回jsonp数据类型
Jsonp格式:
success_jsonpCallback({“Cookies”:”888888”})
由于这种格式与json格式有所不同,只用WebAPI里的返回IHttpActionResult或HttpRequestMessage类型不行,最后通过流的方式输出才实现了这个格式。
WebAPI代码:
[Route("api/GetValue")] [HttpGet] public void GetValue() { string ccc = MyTools.Request.GetString("callbackparam"); var a = new { name = "Cookies", value = MyTools.Cookies.GetCookiesValue("name") }; string result = ccc + "({\"Cookies\":\"" + MyTools.Cookies.GetCookiesValue("name") + "\"})"; //var response = Request.CreateResponse(HttpStatusCode.OK); //response.Content = new StringContent(result, Encoding.UTF8); HttpContext.Current.Response.Write(result); HttpContext.Current.Response.End(); // return response; } [Route("api/SetValue/{id}")] [HttpGet] public void SetValue(int id) { //string domain = ""; string domain = ".wbl.com"; MyTools.Cookies.ClearCookies("name", domain); MyTools.Cookies.SetCookiesValue("name", id.ToString(), domain); string ccc = MyTools.Request.GetString("callbackparam"); string result = ccc + "({\"result\":\"设置成功\"})"; HttpContext.Current.Response.Write(result); HttpContext.Current.Response.End(); }
最终效果:
后言:
这只是解决这个问题的一种方法。百度后还有一种通过第三方插件(Cross-Origin、Help Page)来处理的,后续在进行实验。各位路过的大神如有更好的方法,望不要吝啬,请赐教!菜鸟感激不尽!
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持猪先飞!
相关文章
- 这篇文章主要介绍了如何使用jQuery操作Cookies方法解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下...2020-09-08
c# 获取CookieContainer的所有cookies函数代码
这篇文章主要介绍了c# 获取CookieContainer所有cookies的函数代码,需要的朋友可以参考下...2020-06-25- 以前觉得cookies操作无非就那么几种,但是“杯具事件”还是很多的,下面分享一下对cookies的简单操作...2020-06-25
- .ashx文件中获取cookies值对于一些高手们就不多说了,至于一些小白们还是有必要多多学习啊,好了话不多说,看代码,感兴趣的你可不要错过了哈...2021-09-22
selenium中get_cookies()和add_cookie()的用法详解
这篇文章主要介绍了selenium中get_cookies()和add_cookie()的用法详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2020-04-29C#中Request.Cookies 和 Response.Cookies 的区别分析
本文通过实例代码向我们展示了C#中Request.Cookies 和 Response.Cookies 的区别,文章浅显易懂,这里推荐给大家。...2020-06-25- Cookies想必所有人都了解本文将围绕Cookies基础知识(什么是Cookies/Cookies如何传递/Cookies如何存储/Cookies如何查看)Cookies高级知识/Cookie的限制等等方方面面深入了解,感兴趣的朋友可以参考下,或许对你学习cookies有所帮助...2021-09-22
- 不同的浏览器会把cookie文件保存在不同的地方.这篇文章主要介绍了C# 清除cookies的代码,需要的朋友可以参考下...2020-06-25
ASP.Net WebAPI与Ajax进行跨域数据交互时Cookies数据的传递
本文主要介绍了ASP.Net WebAPI与Ajax进行跨域数据交互时Cookies数据传递的相关知识。具有很好的参考价值。下面跟着小编一起来看下吧...2021-09-22- 这篇文章主要介绍了scrapy中如何设置应用cookies的方法(3种),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2020-09-22
- cookie数据存放在客户的浏览器上,session数据放在服务器上,cookie不是很安全,别人可以分析存放在本地的COOKIE并进行COOKIE欺骗,考虑到安全应当使用session...2021-09-22
- ASP.NET下对cookies的操作实现代码,需要的朋友可以参考下。...2021-09-22
Asp.net内置对象之Cookies(简介/属性方法/基本操作及实例)
本文将围绕cookies了解Cookies对象/Cookie对象的属性和方法/Cookie的基本操作及实例:Cookie的写入和读取/Cookie对象相比Session、Application的优缺点扥等,感兴趣的朋友可以了解下,或许对你学习cookies有所帮助...2021-09-22- 这篇文章主要介绍了c#和net存取cookies操作示例,需要的朋友可以参考下...2020-06-25