网创优客建站品牌官网
为成都网站建设公司企业提供高品质网站建设
热线:028-86922220
成都专业网站建设公司

定制建站费用3500元

符合中小企业对网站设计、功能常规化式的企业展示型网站建设

成都品牌网站建设

品牌网站建设费用6000元

本套餐主要针对企业品牌型网站、中高端设计、前端互动体验...

成都商城网站建设

商城网站建设费用8000元

商城网站建设因基本功能的需求不同费用上面也有很大的差别...

成都微信网站建设

手机微信网站建站3000元

手机微信网站开发、微信官网、微信商城网站...

建站知识

当前位置:首页 > 建站知识

web前端中由SameSite字段引发的悲剧是怎样的

web前端中由SameSite字段引发的悲剧是怎样的,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。

创新互联主要从事网站建设、成都网站设计、网页设计、企业做网站、公司建网站等业务。立足成都服务息县,十年网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:18980820575

 最近,小千早上起来的时候,有同学反映后台的更新功能失效了,打开之后发现确实后台显示报错,如下图所示。

web前端中由SameSite字段引发的悲剧是怎样的

      后来排查了一下,发现这次请求确实没有发cookie信息到后台

      由于后台是用session存储用户的登录状态的,所以如果这里少了cookie信息的话,由于http本身是无状态的,导致不知道是哪个用户登录了,这里就报了ERROR_SESSION这样的错误,苦思冥想之后,各种搜索,突然发现了一点线索,就是这个 SameSite字段搞得怪。

      关于SameSite字段的介绍

      SameSite 是HTTP响应头 Set-Cookie 的属性之一。它允许您声明该Cookie是否仅限于第一方或者同一站点上下文。

      SameSite 接受下面三个值:

      Lax

      Cookies允许与顶级导航一起发送,并将与第三方网站发起的GET请求一起发送。这是浏览器中的默认值。

      Strict

      Cookies只会在第一方上下文中发送,不会与第三方网站发起的请求一起发送。

      None

      Cookie将在所有上下文中发送,即允许跨域发送。

      注意:以前 None 是默认值,但最近的浏览器版本将 Lax 作为默认值,以便对某些类型的跨站请求伪造 (CSRF) ***具有相当强的防御能力。

      问题解决

      由于更新接口这里的请求方式是 post,然后现在chrome浏览器里面的SameSite字段的默认值是Lax,导致cookie信息没有被发送到后台去,经过一轮搜索之后,发现要添加以下内容,才能完整解决这个问题

web前端中由SameSite字段引发的悲剧是怎样的

      由于我们现在后台的请求库是 axios,所以要在 axios这里添加一个配置项

      axios.defaults.withCredentials = true;//允许跨域携带cookie信息http://www.changhai120.com/     

      再修改一下chrome浏览器中SameSite字段的设置,具体步骤如下所示:

      在地址栏输入,chrome://flags

      然后输入 SameSite,设置以下三处为 Disabled

web前端中由SameSite字段引发的悲剧是怎样的

      接下来重启以下浏览器,然后再看一下发送的请求,这个时候发现cookie信息已经可以正确发送了,

看完上述内容,你们掌握web前端中由SameSite字段引发的悲剧是怎样的的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注创新互联行业资讯频道,感谢各位的阅读!


文章名称:web前端中由SameSite字段引发的悲剧是怎样的
本文来源:http://bjjierui.cn/article/igogsd.html

其他资讯