前端流程
1. 引入极光认证 SDK:
- 通过 <script> 标签引入 ,在 public/index.html 中确认 SDK 脚本已正确加载:参考官网Web SDK 概述 - 极光文档
<!-- 引入极光认证 SDK -->
<script type="text/javascript" src="https://jverification.jiguang.cn/scripts/jverification-web.5.2.0.min.js?v=4"></script>
2. 初始化 SDK
- 参考极光官方文档:Web SDK API - 极光文档
mounted() {// 确保 SDK 已加载if (window.JVerification) {this.initJVerification();} else {const script = document.createElement('script');script.src = 'https://jverification.jiguang.cn/sdk/web/jverification.js';script.onload = this.initJVerification;document.head.appendChild(script);}
},
methods: {initJVerification() {JVerification.init({appkey: '你的AppKey', // 替换成你的AppKey});}
}
3. 获取 loginToken
- 参考极光官方文档:Web SDK API - 极光文档
这里需要加强注意:
1. 极光官方文档中有两个 api 用于获取 token 但是一键登录是 loginAuth
2. 在调用 loginAuth 中要使用公网 ip,并提前报备在极光平台中
<template><div><button @click="getLoginToken">一键登录</button></div>
</template><script>
export default {methods: {async getToken() {const operater = 'CM'; // 示例运营商,替换为您需要的运营商代号const options = {operater,type:"full",success: (data) => {this.jverificationData = {...this.jverificationData,getTokenSuccess: data,loginToken: data.content,operater: data.operater};this.loginData.loginToken = data.contentconsole.log('获取Token成功:', data);// 添加其它处理逻辑},fail: (data) => {this.jverificationData = {...this.jverificationData,getTokenError: data};console.error('获取Token失败:', data);},};if (window.JVerificationInterface && this.jverificationData.isInitSuccess) {window.JVerificationInterface.loginAuth(options);} else {console.error('SDK未初始化或初始化未成功,无法获取Token');}},}
}
</script>
后端流程
1. 发送请求到极光 API
- 使用获取到的 Token,将其发送到极光提供的 API 进行验证,并获取加密的手机号码。
参考官方文档:一键登录 API - 极光文档
- 也可采用前端直接调用极光 API
import axios from 'axios';const getPhoneNumber = async (loginToken) => {try {const response = await axios.post('https://api.verification.jpush.cn/v1/web/loginTokenVerify',{loginToken: loginToken,exID: '1234566', // 可选},{auth: {username: '你的AppKey', // 替换成你的AppKeypassword: '你的Master Secret', // 替换成你的Master Secret},headers: {'Content-Type': 'application/json',},});return response.data;} catch (error) {console.error('Error:', error);return null;}
};export default getPhoneNumber;
2. 解密手机号
- 加密的手机号码需要用 RSA 私钥解密。此过程通常在服务器端完成 。
参考官网示例 Java:
import javax.crypto.Cipher;
import java.security.KeyFactory;
import java.security.PrivateKey;
import java.security.spec.PKCS8EncodedKeySpec;
import java.util.Base64;public class RSADecrypt {public static void main(String[] args) throws Exception {String encrypted = args[0];String prikey = args[1];String result = decrypt(encrypted, prikey);System.out.println(result);}public static String decrypt(String cryptograph, String prikey) throws Exception {PKCS8EncodedKeySpec keySpec = new PKCS8EncodedKeySpec(Base64.getDecoder().decode(prikey));PrivateKey privateKey = KeyFactory.getInstance("RSA").generatePrivate(keySpec);Cipher cipher=Cipher.getInstance("RSA");cipher.init(Cipher.DECRYPT_MODE, privateKey);byte [] b = Base64.getDecoder().decode(cryptograph);return new String(cipher.doFinal(b));}
}
解密完成后执行自己的登录逻辑,返回登录成功等信息。
其中涉及到 RSA 私钥解密加密的手机号码:给出 RSA 公私钥生成地址:https://www.metools.info/code/c80.html
总结
- 前端:
- 引入和初始化极光认证 SDK。
- 获取 loginToken 并发送到极光 API。
- 处理 API 响应并传递到后端。
- 后端:
- 发送 loginToken 请求到极光 API 验证。
- 使用 RSA 私钥解密加密的手机号码。