@authing/miniapp-uniapp
Authing JS SDK for uniapp
Usage
<template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view>
<text class="title">{{title}}</text>
<button @click="loginByCode">loginByCode</button>
<button @click="loginByPhone">loginByPhone</button>
<button open-type="getPhoneNumber" @getphonenumber="getPhone">getPhone</button>
<button @click="loginByPassword">loginByPassword</button>
<!-- 发送手机短信验证码 -->
<button @click="sendSms">sendSms</button>
<!-- 使用手机短信验证码登录 -->
<button @click="loginByPassCode">loginByPassCode</button>
<button @click="refreshToken">refreshToken</button>
<button @click="updatePassword">updatePassword</button>
<button @click="getUserInfo">getUserInfo</button>
<button @click="updateAvatar">updateAvatar</button>
<button @click="updateUserInfo">updateUserInfo</button>
</view>
</view>
</template>
<script>
import { Authing } from '@authing/miniapp-uniapp'
import { encryptFunction } from '@authing/miniapp-jsencrypt'
const authing = new Authing({
appId: 'AUTHING_APP_ID',
// 公有云部署:Authing 控制台 -> 选择已创建的小程序应用 -> 应用配置 -> 认证配置 -> 认证地址
// 私有化部署:填写你的私有服务地址
host: 'https://my-authing-app.example.com',
// 用户池 ID
userPoolId: '62e221xxxxxxxxxxx7037a39',
// 非必传,密码默认将以明文传输
encryptFunction
})
console.log(authing)
export default {
data() {
return {
title: 'Hello'
}
},
onLoad() {
console.log(uni.chooseImage)
},
methods: {
async loginByCode () {
// 微信小程序限制:wx.getUserProfile 必须使用 button 触发
// 为了防止用户频繁触发登录按钮
// 建议使用 const [error, loginState] = await authing.getLoginState() 方法获取登录态
// 如果 loginState 为 undefined,说明用户未登录,或登录态已过期,则显示登录按钮
// 如果 loginState 不为 undefined,说明用户已登录,且登录态未过期,则无需再显示登录按钮
const [, { encryptedData, iv }] = await uni.getUserProfile({
desc: 'getUserProfile'
})
// 由于微信小程序 wx.login() 获取 code 、 session_key 有效期及相关数据解密的机制
// 偶然情况下 res 会是 undefined
// 所以需要判断 res 是否为 undefined 再进一步处理剩余业务逻辑
// 如果 res 是 undefined,则提示用户再点击一次按钮重新登录即可
const [error, res] = await authing.loginByCode({
// 你的小程序身份源唯一标识
extIdpConnidentifier: 'AUTHING_EXT_IDP_CONN_IDENTIFIER',
wechatMiniProgramCodePayload: {
encryptedData,
iv
},
options: {
scope: 'openid profile offline_access'
}
})
},
/**
* 需要在真机上测试,微信开发者工具不会返回 code
* @param {*} e
*/
async getPhone (e) {
const { code } = e.detail
const [error, res] = await authing.getPhone({
// 你的小程序身份源唯一标识
extIdpConnidentifier: 'AUTHING_EXT_IDP_CONN_IDENTIFIER',
code
})
},
async loginByPassword () {
const [error, res] = await authing.loginByPassword({
passwordPayload: {
// 你的用户密码
password: 'USER_PASSWORD',
// 你的用户名
username: 'USER_NAME'
},
options: {
// 如果使用 rsa,则需要安装 @authing/miniapp-jsencrypt 并在初始化 SDK 时传入 encryptFunction
// 如果使用 sm2,则需要安装 @authing/miniapp-sm2encrypt 并在初始化 SDK 时传入 encryptFunction
passwordEncryptType: 'rsa',
scope: 'offline_access openid profile'
}
})
},
async sendSms () {
const [error, res] = await authing.sendSms({
phoneNumber: '131xxxxxxxx',
phoneCountryCode: '+86',
// 指定 channel 为 CHANNEL_LOGIN,发送登录所用的验证码
channel: 'CHANNEL_LOGIN'
})
},
async loginByPassCode () {
const [error, res] = await authing.loginByPassCode({
passCodePayload: {
// 手机收到的短信验证码
passCode: 'xxxx',
phone: '131xxxxxxxx',
phoneCountryCode: '+86'
},
options: {
scope: 'openid profile offline_access'
}
})
},
async refreshToken () {
const [error, res] = await authing.refreshToken()
},
async updatePassword () {
const [error, res] = await authing.updatePassword({
newPassword: 'USER_NEW_PASSWORD',
oldPassword: 'USER_OLS_PASSWORD',
// 如果使用 rsa,则需要安装 @authing/miniapp-jsencrypt 并在初始化 SDK 时传入 encryptFunction
// 如果使用 sm2,则需要安装 @authing/miniapp-sm2encrypt 并在初始化 SDK 时传入 encryptFunction
passwordEncryptType: 'sm2'
})
},
async getUserInfo () {
const [error, res] = await authing.getUserInfo()
},
async updateAvatar () {
const [error, res] = await authing.updateAvatar()
},
async updateUserInfo () {
const [error, res] = await authing.updateUserInfo({
address: 'YOUR_ADDRESS'
})
}
}
}
</script>