前后端分离项⽬的跨域及保持Session会话
当Web项⽬前后端分离开发的时候, 由于域名不⼀致, 会出现⽆法请求和⽆法维持会话的情况
OPTIONS
在前端Ajax请求后台的时候, 打开控制台可以看到, 每⼀次请求之前都会有⼀次OPTIONS类型的请求
OPTIONS称为预检请求, 通过这个请求, 浏览器会告知服务器,接下来的请求的情况jsessionid
Access-Control-Request-Method: POST
Access-Control-Request-Headers: X-PINGOTHER, Content-Type
得到服务器的回应后浏览器便知道这次请求是否被允许
OPTIONS的处理
后台可以在或过滤器中处理这个请求, 这⾥以Springboot后台的为例
public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object o) {
String method = Method().toLowerCase();
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "GET, POST, OPTIONS, PUT, PATCH, DELETE");
response.setHeader("Access-Control-Allow-Headers", "X-Requested-With,content-type");
response.setHeader("Access-Control-Allow-Credentials", "true");
response.setHeader("Access-Control-Expose-Headers", "TK");
if (method.equals("options")){
return false;
}
//...
return true;
}
以下两个特别说明
Access-Control-Allow-Headers 代表允许浏览器可以向服务器发送哪些请求头
Access-Control-Expose-Headers 代表允许浏览器可以读取哪些服务器发送的请求头
均限制在客户端上
利⽤Token保持会话
传统开发前后端能维持会话, 是因为当服务器调⽤了HttpSession时, 会将SessionId放在请求头的set-cookie中, 浏览器读取到了这个信息, 就把SessionId保存在本地, 待下次请求时以Cookie的形式带给服务器, 服务器根据收到的SessionId到Session 以继续会话
现在由于前后端分离后使⽤Cookie的种种不便, 可以换另⼀种⽅式来进⾏SessionId的传输, 就是把SessionId放在请求头中带给浏览器
接上⼀段代码
public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object o) {
//...
HttpSession session = Session();
response.setHeader("TK",Id());
return true;
}
为什么能维持会话
服务器根据sessionid保持会话这件事是容器完成的, 根据的就是请求中所传来的URL后的;jsessionid= 或者 cookie中的jsESSIONID=,容器根据sessionid⾃动到内存中的Session。
这也是选择;jsessionid=⽅式的原因。这会让你没有感觉像在做前后端分离的开发, 就像传统的jsP开发⼀样, 前后端融合在⼀起。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论