单点登录（接口对接）

目录

一、单点登录简介及思路

二、总结

一、单点登录简介及思路

 单点登录是为了简化用户重复登录、提高效率，改善用户使用体验。根据业务提供一下思路。

1、当集成方（A）发起请求时，会被被集成方（B）的前端会拦截；

2、B拦截请求后截取A请求参数，并封装在B自己请求后台的参数上（由B前端请求B后台）；

3、B前端请求到后台，后台进行解密并需进行验证判断是否是A发起的请求：

        （1）、来源正确，则判断该用户是否为已有用户。是，则返回该用户的登录所需信息（如用户名、角色、电话等）；不是，则创建该用户并指定用户角色。

        （2）、来源错误，则返回错误信息。

前端模拟代码：

前端拦截器：

if (to.path === '/admin/user/login'){
        let project = to.query.project;
        let userInfo = to.query.userInfo;
        let userLogin = {
          project: project,
          userInfo: userInfo,
        }

       let data

      innerLogin(userLogin).then(response => {
         data = response.data.data
        store.dispatch("LoginByName", data).then(() => {
          setStore({
            name: "abc" ,
            content: tendant,
            type: "session"
          })
          sessionStorage.setItem('isNoneEmbedded', true);
          next('/newIndex/index')
        });
      })
    }

 前端按钮：

 <div style="float: left; margin-left: 20px">
      <el-button icon="el-icon-magic-stick" type="primary" @click="clickLogin">
        单点登录
      </el-button>
</div>

clickLogin(){
      let query = {};
      #请求用户信息并加密
      request({
        url: '/admin/login/getInfo',
        method: 'get',
        params: query
      }).then(response => {
        #解密用户信息
        let data = response.data.data;
        let project = data.project;
        let userInfo = data.data;
        let url = "
                http://198.162.9.82：                    
                7898#/admin/user/login?project="+project+"&userInfo=" + userInfo;
      })
    }

后端代码较简单就不展示了。

二、总结

1、一定要根据业务需求、目前代码构成等具体实际情况具体问题具体分析。

2、不懂就要多问问，毕竟大家都是从小白过来的。