最近的项目中用到了单点登录,在登录时会进入一个子系统中,校验成功后再回到本系统。在退出时遇到一个麻烦事,我在本系统点击一次退出需要跑到子系统中,子系统不会自动退出还需要再点一下退出才行,用户体验十分不好。
解决方式如下:
function logout() {
// 先执行子系统的登出
var c_logout = "<form id='c-logout' action='http://外部链接/logout' style='display: none;'></form>";
$("body").append(c_logout);
$("#c-logout").submit();
setTimeout(function () {
var f_logout = "<form id='f-logout' action='xxxxxxxxxx/logout' style='display: none;'></form>";
$("body").append(f_login);
$("#f-login").submit();
}, 100);
}
如果单纯模拟两次表单提交会有一个问题就是只能有一个模拟的表单生效(写在前边的表单),原因是表单提交必然导致页面刷新跳转这么做导致方法后续的代码无法生效,即使在表单中添加了,target="_blank"主线程上的方法都将不再执行,而写在定时器中的代码在一开始就已经注册进事件队列,待主线程执行完跳转前执行由定时器注册的回调函数。
这里需要注意如果将定时器的延迟时间设置的太长将不能达到预期的效果,具体原因还希望和大家共同讨论。