cra-bs v0.0.2

bsy-sso-login 使用文档

bsy-sso-login 是前端对接 SSO 登录的sdk。

快速开始

1. 安装

npm i -S bsy-sso-login

或者

yarn add bsy-sso-login

2. 在代码中使用

bsy-sso-login 本质上默认导出了一个异步的登录函数，所以你需要先在代码中引入它：

import ssoLogin from 'bsy-sso-sdk'

你需要传入以下参数：

import ssoLogin,{cleanAuthUrl} from 'bsy-sso-login'

ssoLogin(
  clientId, // 平台的ID，string(必填)，找后端开发同学要
  debugMode // boolean(必填)，在开发环境请开启调试模式，在生产环境请关闭调试模式
).then(accessToken=>{ // 异步函数执行的结果是 accessToken，使用 accessToken 来作为业务平台的登录请求的参数
    // 以下为示例：
    window.axios.post('/mtrpc/digital/bs.digital.auth.Auth/Login', {
        clientID: process.env.REACT_APP_SSO_CLIENT_ID,
        ssoToken: accessToken
      }).then(({ data }) => {
        cleanAuthUrl() // 请务必在登录之后调用这个函数（用于清除URL中已经被使用过的参数）
        window.localStorage.setItem('user-info', JSON.stringify(data))
      })
  })

拿到token之后，就可以在业务中发网络请求了。

如果token失效，则网络请求响应的code是1016，

所以你需要在网络请求中判断，如果code=1016，则需要清除原来保存的token信息，并且刷新页面, bsy-sso-login导出了一个token失效之后的处理函数，你可以在定义请求实例的时候使用它：

import { onTokenInvalid } from 'bsy-sso-login'

if (code === 1016) {
  onTokenInvalid()
}

一个使用示例

在 React 项目的根组件中：

// App.js
import React, { useEffect, useState } from 'react'
import Pages from './pages'
import { Spin } from 'antd'

import 'util/initRequest' // 初始化网络请求模块
import ssoLogin, { cleanAuthUrl } from 'bsy-sso-login'

import './App.css'

const App = () => {
  const [logining, setlogining] = useState(true)

  useEffect(() => {
    ssoLogin(
      [clientID],
      [debugMode],
    ).then(accessToken => {

      if (!accessToken) {
        setlogining(false)
      } else {
        window.axios.post('/mtrpc/digital/bs.digital.auth.Auth/Login', {
          clientID: process.env.REACT_APP_SSO_CLIENT_ID,
          ssoToken: accessToken
        }).then(({ data }) => {
          setlogining(false)
          cleanAuthUrl()
          window.localStorage.setItem('user-info', JSON.stringify(data))
        })
      }

    })
  }, [])

  return (
    <Spin spinning={logining} tip="正在获取SSO授权...">
      <Pages />
    </Spin>
  )
}

export default App

或者直接参考 /test 目录下的示例项目

SSO登录过程