# 集成单点登陆

# 工程示例

系统应用单点集成示例工程打开 (opens new window)

# 本内容你将获得

  • 集成 oauth2 单点登陆的方式
  • oauth2 授权服务的使用场景

# 版本说明

  • alinesno-ui:1.7 +
  • alinesno-cloud-platform:2.1.2-Alpha +

# 集成步骤

这里主要把集成步骤,部分细节请参考示例工程

# 获取登陆密钥

# 登陆统一授权服务

# 添加应用获取密钥

添加应用,如下图:

配置说明:

  • 服务地址: 单点退出回调调用,会自动调用http://服务地址/sso/notifyUr
  • 授权范围: 选择自动授权服务

点击列表应用名称查看单点登陆的密钥

# 前端配置单点登陆

# 添加拦截配置

在 main.js 中添加以下配置引入:

import { EnableUaaClient } from 'alinesno-ui/src/router/router-guard'

Vue.use(EnableUaaClient, { routerInstance: router })
new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
})

注释掉 permission.js 文件中的退出配置,此会拦截单点的配置,注释掉即可

router.beforeEach((to, from, next) => {
  NProgress.start()
  if (getToken()) {
    /* has token*/
    if (to.path === '/login') {
      next({ path: '/' })
      NProgress.done()
    } else {
      if (store.getters.roles.length === 0) {
        // 判断当前用户是否已拉取完user_info信息
        store
          .dispatch('GetInfo')
          .then(() => {
            store.dispatch('GenerateRoutes').then(accessRoutes => {
              // 根据roles权限生成可访问的路由表
              router.addRoutes(accessRoutes) // 动态添加可访问路由表
              next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
            })
          })
          .catch(err => {
            // 单点登陆注释掉
            // store.dispatch('LogOut').then(() => {
            //   console.log('err = ' + err)
            //   Message.error(err)
            //   next({ path: '/' })
            // })
          })
      } else {
        next()
      }
    }
  } else {
    next()
  }
})

退出的配置,在 store/modules/use.js 配置 LogOut 响应,如下

  // 退出系统
    LogOut({ commit, state, payload }) {

    return new Promise((resolve, reject) => {
        userLogout(state.token, payload).finally(() => {

           var userToken = getToken() ;
           commit('SET_TOKEN', '')
           commit('SET_ROLES', [])
           commit('SET_PERMISSIONS', [])
           removeToken()

           window.location.href = BASE_API_URL + "/logout?userToken=" + userToken ;
         }).catch(error => {
           reject(error)
         })
       })
     }

# 后台集成单点登陆

调用EnableApi注解为EnableSSO,如下图:

// @EnableApi
@EnableSSO  // 单点登陆注解
@SpringBootApplication(exclude = DataSourceAutoConfiguration.class)
public class SaasWebApplication {

	public static void main(String[] args) throws IOException {
		SpringApplication.run(SaasWebApplication.class, args);

	}

}

添加单点登陆配置,在 yaml 文件中添加以下配置

alinesno:
  uaa:
    redirect-uri: http://localhost:1024
    client-id: 43b564b9f38dea259a39270ed1dd8159
    client-secret: 897777476384587776
    authorization-server: 单点登陆地址

到此处配置完成,重新访问前端的时候,会自动跳转到单点登陆的论证

# 其它