@xverse/auth
v0.1.5
Published
> BREAKING CHANGE: > 0.1.x 版本引入了破坏性更新, 使用 createAuthedHttp() 取代 new AuthH()
Downloads
3
Keywords
Readme
鉴权模块
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 模块
这种方法适用:所有接口都需要鉴权的情况下,它还要求:
- 返回的响应里包含
code
错误码,错误码为未登录(16
) - 返回的响应里包含
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 建议都作为单例使用