跨域登陆

• 引言
• 为何跨域登陆后前端页面没法保持登陆状态？
• 跨域登陆后如何保持会话？

• 引言

先后端分离（部署）项目，登陆后可能出现会话没法维持致使当即退出登陆的现象。

 

• 为何跨域登陆后前端页面没法保持登陆状态？

Web 应用登陆后，服务端会产生会话来存储用户信息，好比用户ID、用户名以及用户会话ID等等。当登陆请求返回客户端（浏览器）时，返回信息会包含一些 Cookie 信息，一般有会话ID，JAVA后台一般是“JSESSIONID”，浏览器会根据服务端返回的 Cookie 信息产生相应的 Cookie。

若是客户端和服务端没有跨域，那么在下一次客户端请求服务端时，浏览器会自动携带 Cookie 信息，服务端检测到客户端的请求包含会话信息，通过比对，若是会话信息准确而且没有过时，那么客户端仍是处于登陆状态而且能访问被受权资源。

可是浏览器 不能读取跨域的 Cookie 信息。所以，当客户端跨域访问时，浏览器 不能 读取先前 跨域的服务端 返回的 Cookie 信息。服务端检测不到客户端请求的会话信息，因此，服务端判断 客户端并无登陆！

 

• 跨域登陆后如何保持会话？

要解决跨域登陆保持会话，首先要确保登陆后的请求能够读取登陆时设置的跨域 Cookie，其次是登陆后的请求要能携带登陆时的 Cookie。

以 jQuery 插件为例，发送请求时，设置“crossDomain: true”以及“xhrFields: {withCredentials: true}”便可。以下代码所示：

$.ajax({ type: "POST", url: baseURL + "users/garnetlogin", data: data, contentType: "application/json", crossDomain: true, xhrFields: { withCredentials: true }, success: function (result) { // code..
 } });

 

固然，服务端也须要容许客户端跨域、容许客户端发送凭证。以下 JAVA 代码所示（假设客户端域为“http://localhost.cn”）：

response.setHeader("Access-Control-Allow-Origin", "http://localhost.cn"); response.setHeader("Access-Control-Allow-Methods", "POST, PUT, GET, OPTIONS, DELETE"); response.setHeader("Access-Control-Allow-Headers", "*"); response.setHeader("Access-Control-Allow-Credentials", "true");