简单的单点登陆实现方案

针对场景

  • 各个web系统一级域名相同,如域名都是 *.example.com
  • 只考虑支持CORS的浏览器


AUTH工程是什么

  • 是各个web系统的集中式登录验证后台
  • 是各个web系统目前单点登录的解决方案主体


AUTH上线后的变化

  • 各个web系统的登录和退出调用全部交由AUTH处理
  • 各个web系统打破了边界限制,可以像一个web系统一样运作和跳转


AUTH的登录和退出流程

  • 各个web系统向AUTH发出跨域ajax调用请求登录
  • AUTH登录验证成功
    • 将session存储到session/redis/mysql中
    • 将cookie跨二级域写到ajax请求方的浏览器中
  • 各个web系统向AUTH发出跨域ajax调用请求退出
  • AUTH退出操作
    • 判断cookie是否存在
    • 如果存在cookie清理对应的session和cookie
    • 如果不存在,无需清理session


AUTH的技术要点

  • 跨域请求
  • 跨二级域写cookie


如何实现跨域请求

采用了CORS方案:
当你使用XMLHttpRequest发送请求时,浏览器发现该请求不符合同源策略,会给该请求加一个请求头:Origin, 后台进行一系列处理,如果确定接受请求则在返回结果中加入一个响应头:Access-Control-Allow-Origin; 浏览器判断该相应头中是否包含Origin的值,如果有则浏览器会处理响应,我们就可以拿到响应数据, 如果不包含浏览器直接驳回,这时我们无法拿到响应数据。

  • 前端不用调整
  • 后端给返回http报文添加Access-Control-Allow-Origin头部和请求的Origin头部保持一致即可

    self.set_header('Access-Control-Allow-Origin', self.request.headers['Origin'])


如何实现跨二级域写cookie

  • 前端ajax请求 添加 xhrFields:{ withCredentials:true },
$.ajax({
    url: url ,
    type: 'POST',
    dataType: 'json',
    data: rqdata,
    success: function (returndata) {
        window.location.href = "/admin";
    },
    error: function (returndata) {
        console.log(returndata)
    },
    xhrFields:{
        withCredentials:true
    },
    crossDomain: true
 });
  • 后端设置的头部
    self.set_header('Access-Control-Allow-Credentials', 'true')


Previous(前一篇)     Next(后一篇)
stach.tan /
Published in categories 经验  tagged with github