前端统一身份认证单点登录涉及到的非简单请求、跨域、重定向、cookie设置问题

最近有一个需求，本项目需要做统一身份认证，通过单点登录方式实现。简单来说，就是A企业有很多系统，使用的是同一套认证方式，并且打算使用我们的系统，希望我们可以对接他们的认证方式，只要他们授权通过，我们就不需要再使用用户名密码登录。

我们的项目前后端分离，前端使用vue、axios，前端服务端口80，后端使用Java SpingBoot，nginx，服务端口8080。

操作的思路如下：

在浏览器输入我们系统的url（例如：http://www.xxx.com/login），前端请求后端8080/login接口，后端返回重定向把Location设置为A企业认证平台（他们的url为：https://aaa.aaa.cn/cas/login?service=http://www.xxx.com/login），输入他们的用户名密码后，通过认证，他们再重定向回我们的系统http://www.xxx.com/login，此时会带上通过认证的cookie（JSESSIONID=11118B2BE0511112F935403F11111111），我们这边后端根据获取的JSESSIONID判断是否通过认证，如果通过认证，后端8080/login接口返回重定向把Location设置为www.xxx.com/main?jsessionid=xxxx49Bxxxx03xxxx128CCxxxx54xxxx&username=999999，再继续进行后续的业务操作。

出现问题1：

重定向回来后，重定向url是http://www.xxx.com/main，导致前端获取此时cookie所在的域是前端服务80端口，请求后端接口时，需要后端服务8080端口带上cookie的JSESSIONID，因此需要前端手动设置cookie（见下方axios手动设置cookie）

解决问题1（axios手动设置cookie）：

走了很多弯路，例如后端Access-Control-Allow-Origin设为‘*’等。只要后端设置Access-Control-Allow-Credentials: true、Access-Control-Allow-Origin:http://www.xxx.com（需明确指定发起请求的域）就可以了。前端axios设置axios.defaults.withCredentials = true;就可以。像下面的报错就不会出现了：

出现问题2

http请求中如果有这样的设置Content-Type:application/json;charset=UTF-8，那么该请求就是费简单请求，跨域时会发送两次请求，一次option预请求、一次get或post正式请求。如果option预请求发现后端不支持跨域，就会直接报错，不发送正式请求了。

解决问题2

需要后端设置，可以设置忽略option请求，直接返回200状态码。

参考资料：

跨域介绍----https://www.jianshu.com/p/89a377c52b48

跨域介绍----https://segmentfault.com/a/1190000015597029

axios请求带上cookie----https://www.cnblogs.com/xiaoxiaodek/p/7238598.html

出现问题3

两个接口的请求头完全一样，但是一个200成功一个302重定向
屏蔽OSS.Wrapper后，两个接口都正常200了，但是后续接口仍然302
发现同一页面密集请求时，只有第一个接口能正常返回200，剩下的都是302
发现JSESSIONID不重复时可以正常200，开始重复就返回302

解决问题3
经过沟通分析，结果是我们auth认证导致了JSESSIONID被篡改，去掉auth认证就可以正常访问了。