@jxstjh/auth-client

AuthClinet

匹配4a单点SSO的前端工具包.

如何使用

当你熟悉单点SSO背后的流程后,你会发现其实变通使用的方法非常自由.但是我们强烈建议按照本文档的使用方法 $ npm install @jxstjh/auth-client

站点统计工具类

import { SiteAnalysis } from '@jxstjh/auth-client'

const IS_PROD = ['production', 'prod'].includes(process.env.NODE_ENV)
window.SA = new SiteAnalysis({
  siteAnalysisServer: 'http://constcount.dev.jxwrd.gov.cn', // 统一上报服务器
  appId: 'cb11c7ba-df52-4142-9312-c195f2baf7bb', // appId
  interval: 30, // 上报日志频率 单位秒
  production: IS_PROD // 开发模式下不上报
})
// 在全局路由拦截器中 加入页面访问日志
router.afterEach(() => {
  window.SA.recordPage() // 记录页面log
  // something else...
})
// 登录成功时候 取到用户名
window.SA.setLoginName(loginName)

SSO 工具类

import { AuthClient } from '@jxstjh/auth-client'

const startupService = () => {
  return new Promise((resolve, reject) => {
    // doSomething else ...根据实际情况执行其它前置逻辑
    const ac = new AuthClient({
      routerMode: 'history', // 'history'||'hash' 根据实际项目路由情况选择 缺省值'hash'
      SSOServer: 'https://auth-test.jxwrd.gov.cn/',// 必填 sso认证地址 
      resourceCode: 'code', // 必填 resourceCode || 'code'
    })
    ac.on('error', (err) => {
      return reject(err)
    })
    ac.on('inited', (e) => {
      console.log(e)
      // TODO:成功拿到用户信息及token
      // 设置好vuex
      return resolve()
    })
  })
}
startupService()
  .then(()=>{
    new Vue({
     router,
     store,
     render: h => h(App)
   })
  })
  .catch((err) => {
    console.log(err)
  })

流程说明