前端请求cookie丢失问题

 

问题提出

在开发中的登陆功能基本思路如下：

1. 前端请求验证码，后端生成一个验证码（保存在session中）并将其返回给前端，
2. 前端用户输入账号、密码、验证码后将表单传给后端，后端对比session中的验证码和用户输入的是否一致。

但是后端在第二步时，session中没有存有之前生成的验证码，也就无法对比用户的验证码是否正常，导致系统一直无法进入。

问题分析

首先需要考虑跨域问题，前端发送请求时要携带cookie，否则获取验证码请求和登陆请求会创建两次session，导致无法取出上一次产生的验证码。打开开发者工具会发现请求头中没有cookie。

解决思路

在项目前后端中加入跨域代码

https://www.jianshu.com/p/dc506490c796  // 前端案例
https://www.cnblogs.com/gcdd/p/12292415.html  //后端案例

但是本项目在前后端已经加入了相关的代码，还是存在没有cookie的现象。

浏览器层面问题

之前测试都是在chrome浏览器中进行的，换了火狐发现这个问题不复存在了，所以很可能是chrome浏览器的问题，经过百度发现chrome浏览器会存在session“丢失“问题。具体现象如下：

https://www.jianshu.com/p/76d026cc4dd7
https://blog.csdn.net/fouling/article/details/108357824

所以将chrome浏览器的SameSite属性关闭即可。 在浏览器输入这个地址

chrome://flags/

然后将SameSite属性设置为Disabled即可解决问题。