ASP.Net中关于WebAPI与Ajax进行跨域数据交互时Cookies数据的传递

本文主要介绍了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代码:

///   /// 给指定的 Cookies 赋值  ///   /// Cookies 名称  /// Cookies 值  /// 设置与此 Cookies 关联的域(如:“.tpy100.com”)(可以使该域名下的二级域名访问)  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();  }

登录后复制

最终效果:

ASP.Net中关于WebAPI与Ajax进行跨域数据交互时Cookies数据的传递

后言:

这只是解决这个问题的一种方法。百度后还有一种通过第三方插件(Cross-Origin、Help Page)来处理的,后续在进行实验。各位路过的大神如有更好的方法,望不要吝啬,请赐教!菜鸟感激不尽!

以上就是ASP.Net中关于WebAPI与Ajax进行跨域数据交互时Cookies数据的传递的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2494669.html

(0)
上一篇 2025年3月5日 01:58:38
下一篇 2025年3月5日 01:58:55

AD推荐 黄金广告位招租... 更多推荐

发表回复

登录后才能评论