目前,华为AGC认证服务曾经反对Web平台了,我这边依照官网文档进行了如下集成,有须要的小伙伴能够参考,也能够自行下载Demo钻研。
集成步骤
- 开明服务
a) 在AGC创立JS利用
b) 开明认证服务
c) 开明匿名账号,电话以及邮箱认证
- 集成SDK
a) 将配置代码放入login.vue文件中
b) 在IDE的terminal中进入我的项目门路,执行命令装置AGC JS SDK到我的项目中,导入认证组件
- 接入性能
a) 匿名帐号
点击匿名登录按钮,绑定逻辑代码如下:
loginAnonymously() { console.log("JS-SDK login anonymously!"); agconnect.auth().signInAnonymously().then(user => { //登录胜利 alert("匿名登录胜利"); this.getUserInfo(); }).catch(error => { //登录失败 alert(error) }); },
匿名登录胜利后展现UID:
b) 手机号码与邮箱认证(明码形式):
输出手机号/邮箱和明码进行登录:
loginByPwd() { console.log("JS-SDK auth(): login...") let credential = null; if (this.dataForm_sdk.password == '') { alert("Please typein password!"); return; } switch (this.provider) { case 'phone': credential = agconnect.auth.PhoneAuthProvider.credentialWithPassword('86', this.dataForm_sdk.account, this.dataForm_sdk.password); break; case 'email': credential = agconnect.auth.EmailAuthProvider.credentialWithVerifyCode(this.dataForm_sdk.account, this.dataForm_sdk.password); break; default: break; } if (credential == null) { console.log("credential null!"); return; } agconnect.auth().signIn(credential).then(res => { alert("登录胜利"); this.getUserInfo(); }).catch(err => { alert(err); }); },
c) 手机号码与邮箱认证(验证码形式):
输出手机号/邮箱后点击获取验证码:
getVerifyCode() { console.log("request for email verifycode...") this.dataForm_sdk.verifyCode = ''; switch (this.provider) { case 'phone': //获取验证码 agconnect.auth.PhoneAuthProvider.requestVerifyCode('86', this.dataForm_sdk.account,agconnect.auth.Action.ACTION_REGISTER_LOGIN, 'zh_CN', 90).then(ret => { //验证码申请胜利 alert("获取验证码胜利"); }).catch(error => { //验证码申请失败 alert("获取验证码失败"); }); break; case 'email': agconnect.auth.EmailAuthProvider.requestVerifyCode(this.dataForm_sdk.account, agconnect.auth.Action.ACTION_REGISTER_LOGIN, 'zh_CN', 120).then(ret => { //验证码申请胜利 alert("获取胜利"); }).catch(error => { //验证码申请失败 alert(error) }); break; default: break; } },
获取验证码后进行登录:
loginByVerifyCode() { if (this.dataForm_sdk.verifyCode == '') { alert("Please typein verifycode!"); return; } let credential = null; switch (this.provider) { case 'phone': credential = agconnect.auth.PhoneAuthProvider.credentialWithVerifyCode('86', this.dataForm_sdk.account, this.dataForm_sdk.password, this.dataForm_sdk.verifyCode); break; case 'email': credential = agconnect.auth.EmailAuthProvider.credentialWithVerifyCode(this.dataForm_sdk.account, this.dataForm_sdk.password, this.dataForm_sdk.verifyCode); break; case 'QQ': break; case 'weChat': break; default: break; } if (credential == null) { console.log("credential null!") return; } agconnect.auth().signIn(credential).then(res => { alert("登录胜利"); this.getUserInfo(); }).catch(err => { alert(err); }); },
总结:
华为AGC认证服务反对的认证形式还是比拟全的,整个认证过程也不简单,对于开发者比拟敌对。
欲了解更多详情,请参见:
华为AGC认证服务-Demo:https://github.com/AppGallery...
原文链接:https://developer.huawei.com/...
原作者:Mayism