layui框架跨域请求携带Cookie

Posted jerrytomcat

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了layui框架跨域请求携带Cookie相关的知识,希望对你有一定的参考价值。

学习了解跨域请求携带cookie的问题,需要从页面和后台两处设置。
.net Core api后台接口项目可在设置跨域策略处,设置响应头Access-Control-Allow-Credentials响应头为"true",
允许跨域请求携带cookie,还需设置Access-Control-Allow-Origin为当前的请求域名。

正好,net core跨域策略已经全部处理好,只需在添加跨域策略时用到两个方法,AllowCredentials()为允许跨域凭据(包含cookie和http身份验证方案)和
withOrigins()设置跨域请求域名。

页面中如果用ajax发起请求,默认跨域请求不携带cookie,如果需要ajax发起跨域请求并携带cookie需设置xhrFields为true。

从后台和页面两处设置,即可完成跨域请求携带cookie的问题。

但layui框架的表格渲染分页虽然支持跨域请求,但该请求不携带cookie,所以无法从页面请求时携带cookie给后台接口,后台接口的cookie为null。

又因为layui底层使用jquey和ajax处理请求,所以可以在使用layui框架各模块的功能之前,设置ajax全局参数带上xhrFields为true即可,这样之后的ajax跨域请求都可携带cookie,而无需单独设置。
这样表格渲染请求时也带上了cookie。



也可以设置ajax全局请求头(自定义一个请求头),参数值设置为cookie的值也可以,这样后台接口也可以直接从请求头获取cookie的值。

layui框架设置如下:

layui.use([‘table‘, ‘layer‘, ‘form‘, ‘laydate‘], function () {
var table = layui.table,
$ = layui.$,
laydate = layui.laydate,
form = layui.form,
layer = layui.layer;
  1. //ajax全局参数设置 OK
        $.ajaxSetup({
        xhrFields: {
withCredentials: true
}
});//

以上是关于layui框架跨域请求携带Cookie的主要内容,如果未能解决你的问题,请参考以下文章

跨域请求如何携带cookie?不小心都拿了Offer

前端Jquery-Ajax跨域请求,并携带cookie

Ajax跨域请求携带cookie问题

如何配置跨域请求携带cookie

前端跨域请求如何携带cookie?

vue resource 携带cookie请求 vue cookie 跨域