@xverse/auth v0.1.5

鉴权模块

BREAKING CHANGE: > 0.1.x 版本引入了破坏性更新, 使用 createAuthedHttp() 取代 new AuthH()

Setup

• 安装

使用 NPM 私服进行安装，需要在项目 package.json 目录下增加 .npmrc 用于指定 NPM 私服地址，详细参考 操作指引

npm install @xverse/auth@latest

• 引入

如果使用模块引入

import { AuthClient } from '@xverse/auth'

new AuthClient('your_app_id')

如果需要直接从 JS 脚本引入

将 node_modules/@xverse/auth/lib/bundle.umd.js 拷贝到你的项目中并且加载

<script src="your_path_to/bundle.umd.js" >

那么会在 window 下暴露 XverseAuth 的全局变量，它上面挂载了所有导出的方法

new XAuth.AuthClient('your_app_id')

登录

通过 Auth 提供的登录方法会自动跳转到统一账号中心登录，登录完成后会跳转回业务方

• 后端鉴权：使用带鉴权的 HTTP 模块

这种方法适用：所有接口都需要鉴权的情况下，它还要求：

1. 返回的响应里包含 code 错误码，错误码为未登录（16）
2. 返回的响应里包含 data 字段带表响应数据

import { AuthedHttp } from '@xverse/auth'

export const http = createAuthedHttp({
  authAppId: 'xxx',
  onHttpError: message.error,
})

http.get({ url: 'api' })

上面的代码中，初始化 AuthedHttp 需要传入登录用的 AppId，需要向 @xiaweiyi 申请，onHttpError 是对错误码 非 0 的全局错误处理回调。

• 后端鉴权：业务方自己判断登录态

这种方法适用于后端接口不返回 code 和 data 数据格式

import { AuthClient } from '@xverse/auth'

const authClient = new AuthClient('your_app_id')

if (错误码 === '未登录') {
  await authClient.jumpToSignIn()
}

通过后端错误码判断未登录调用 jumpToSignIn 方法即可

• 仅前端鉴权

这种方法适用于后端不进行鉴权的业务，仅在进入页面时就进行一次判断，如果未登录会直接跳转到登录页面，注意它是异步的，需要等待 Promise resolve

import { AuthClient } from '@xverse/auth'

const authClient = new AuthClient('your_app_id')

await authClient.signIn()
// 登录后可以执行的操作

注意： 开发时需要将前端网页代理成 xverse.cn 域名才能生效，否则会无限跳转到登录中心。如何代理参考：https://doc.weixin.qq.com/doc/w3_m_FDriDXZfJdXs?scode=ABwAJwczAA4mhh3KGqAfQALAZuAGg

登出

直接调用 signOut 方法即可完成登出，异步调用完成后会刷新整个页面

import { AuthClient } from '@xverse/auth'

const authClient = new AuthClient('your_app_id')

await authClient.signOut()

查询用户信息

import { AuthClient } from '@xverse/auth'

const authClient = new AuthClient('your_app_id')

await authClient.getUserInfo()

上述的 authClient 建议都作为单例使用