apicloud apicloud

注册
查看: 4947|回复: 19

[模块开发] [ 模块教程 ] aliPhoneAuth(阿里云号码认证服务)demo分享 已解决

驾校小白

UID:817587

主题:
2
帖子:
16
云币:
18

[模块开发] [ 模块教程 ] aliPhoneAuth(阿里云号码认证服务)demo分享 已解决

4947 19 | 发表于 2019-12-30 11:53:53 |阅读模式 | |
本帖最后由 microtown 于 2020-1-10 14:48 编辑

aliPhoneAuth 封装了阿里云号码认证SDK。本模块提供了一键登录功能,可快速拉起阿里云的一键登录并获取token。 号码认证服务整合三大运营商特有的数据网关认证能力,升级短信验证码体验,应用于用户注册、登陆、安全校验等场景,可实现用户无感知校验,操作更安全、便捷、低时延。


模块文档地址


功能介绍:
1. 快速接入阿里云一键登录功能。
2. 可自定义一键登录页面的样式。
3. 可根据自己的场景,分别调用阿里云SDK的某些接口。

模块代码片段
1.  使用前先去阿里云开通号码认证服务,添加认证方案,android及iOS是两种方案,添加后方案后,分别将密钥配置到config.xml文件中。参考模块文档说明。
2.  一键登录调用如下:
  1. <!doctype html>
  2. <html>
  3. <head>
  4.     <meta charset="utf-8">
  5.     <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
  6.     <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  7.     <title>Hello APP</title>
  8.     <link rel="stylesheet" type="text/css" href="./css/api.css" />
  9.     <style>
  10.     input,textarea{border:1px solid #ccc;margin: 5px;padding:5px;border-radius:3px;}
  11.     </style>
  12. </head>
  13. <body><br/><br/>
  14.     <div style="margin:10px;">
  15.         <input type="button" value="阿里云一键登录" onclick="onAliLogoClick()"/><br/>
  16.         <textarea id='resultTxt' style="width:90%;height:150px;">结果:</textarea>
  17.     </div>
  18. </body>
  19. <script type="text/javascript" src="./script/api.js"></script>
  20. <script type="text/javascript">
  21.     apiready = function(){

  22.     };

  23.     //调用事件
  24.     function onAliLogoClick(){
  25.         var systemType=api.systemType;
  26.         if('ios'==systemType){
  27.             iOSClike();
  28.         }else if('android'==systemType){
  29.             androidClick();
  30.         }
  31.     }

  32.     //android调起一键登录
  33.     function androidClick(){
  34.         try{
  35.             //初始化
  36.             var aliPhoneAuth = api.require('aliPhoneAuth');

  37.             //检查环境
  38.             var ret = aliPhoneAuth.checkEnvAvailable();
  39.             if(!ret){
  40.                 alert('环境不支持');
  41.                 return;
  42.             }

  43.             //一键登录修改授权页主题
  44.             //name为函数名,types为参数的类型,需要传数组,values是参数值,需要传数组
  45.             //此方法使用java的反射原理,所以参数类型必需要函数原型一致,函数原型可以参考阿里的SDK,目前只支持java几种原生类型
  46.             //此方法后将config回传,并添加了executeResult及exception字段,以说明方法是否执行成功
  47.             //方法集可以参考[https://help.aliyun.com/document_detail/144231.html?spm=a2c4g.11186623.6.557.734e360cSAs1FG#h2-6-1-20]
  48.             //(经测试,阿里云的文档中,有些方法是不存在的)
  49.                         var config=[
  50.                                 {'name':'setLogBtnText','types':['String'],'values':['一键登录!']},
  51.                                 {'name':'setNumberSize','types':['int'],'values':[30]},
  52.                                 {'name':'setNumberColor','types':['int'],'values':[-4970967]},//android.graphics.Color.parseColor("#RRGGBB")的返回值
  53.                                 {"name":"setAppPrivacyOne","types":["String","String"],"values":["用户协议","https://www.apicloud.com/"]}
  54.                         ];
  55.                         var param = {'config':config};
  56.                         var exeRes =aliPhoneAuth.setAuthUIConfig(param);

  57.             //弹起授权页面
  58.             //ret.event的值有以下几种情况
  59.             //1: normal为调用函数的正常返回
  60.             //2: onAuthUIControlClick 为控件点击事件回调,如点击“其他登录方式”,具体参考:https://help.aliyun.com/document_detail/144231.html?spm=a2c4g.11186623.6.557.734e360cSAs1FG#h2-5-19-19
  61.             //3: onTokenResultSuccess为获取token成功的回调,onTokenResultFailed获取token失败的回调
  62.             //4: onPreLoginResultSuccess为预取号调用成功的回调,onPreLoginResultFailed为预取号调用失败的回调
  63.             //
  64.             //除了使用ret.event外,应该关注ret.code,当ret.code<0时,一般为参数错误,具体见ret.msg
  65.             //函数调用成功,都会返回1,ret.event=‘normal’
  66.             //其他ret.code参考https://help.aliyun.com/document_detail/144231.html?spm=a2c4g.11186623.6.557.734e360cSAs1FG#h2-5-18-sdk-18
  67.                         var param = {timeout:3000};
  68.             aliPhoneAuth.getLoginToken(param, function(ret, err){
  69.                         if(ret.code=='600000'){//获取token成功
  70.                     aliPhoneAuth.quitLoginPage();//关闭一键登录页面(需要先关闭)

  71.                     outputResult(JSON.stringify(ret));

  72.                     //调用服务器业务...

  73.                         }else if(ret.code=='700000'){//点击返回,用户取消授权

  74.                 }else if(ret.code=='700001'){//点击切换按钮,用户取消授权
  75.                     aliPhoneAuth.quitLoginPage();//关闭一键登录页面
  76.                 }
  77.                 });

  78.         }catch(err){
  79.             alert(err);
  80.         }
  81.     }

  82.     //iOS调起一键登录
  83.     function iOSClike(){
  84.         var aliPhoneAuth = api.require('aliPhoneAuth');
  85.         var params={
  86.             timeout: 5.0,
  87.             autoHideLoginLoading: 0,
  88.             privacyOne: ["《用户协议》", "https://www.apicloud.com/"],
  89.             privacyTwo: ["《隐私政策》", "https://www.apicloud.com/"]
  90.         }

  91.         aliPhoneAuth.oneKeyLogin(params, function(ret, err) {
  92.             outputResult(JSON.stringify(ret));

  93.             if (err || !ret) { //错误
  94.                 return;
  95.             }

  96.             if (ret.resultCode == "600000") { //认证通过
  97.                 aliPhoneAuth.cancelLoginVCAnimated();

  98.                 var token = ret.token;

  99.                 //拿token去服务器换取手机号并且登录上
  100.             } else if (ret.resultCode == "700001") { //点击了其他登录方式
  101.                 aliPhoneAuth.cancelLoginVCAnimated();
  102.             }
  103.         });
  104.     }

  105.     function outputResult(msg){
  106.         document.getElementById("resultTxt").value += msg+"\r\n\r\n";
  107.     }
  108. </script>
  109. </html>
复制代码


模块截图
              

模块截图

模块截图

aliPhoneAuth_测试材料包.zip (5.46 MB, 下载次数: 214)

版主

UID:489246

主题:
16
帖子:
3150
云币:
2184
发表于 2019-12-31 07:43:52 |
不错 收藏
app项目开发QQ:897695724

主题:
18
帖子:
63
云币:
81
发表于 2020-2-2 16:30:46 |
购买了,demo代码可用,文档上ret似乎不全。同时发现onekeylogin函数未定义,另外有没有直接可以取到手机号的函数?还是说需要自己在服务端另做一个函数接受token再取?

主题:
18
帖子:
63
云币:
81
发表于 2020-2-2 16:31:51 |
购买了,但是onekeylogin未定义。另外获取token后是否要自己再在服务端定义函数获取用户手机号?

驾校小白

UID:817587

主题:
2
帖子:
16
云币:
18
 楼主| 发表于 2020-2-9 15:47:33 |
瘦鱼全民讲座 发表于 2020-2-2 16:31
购买了,但是onekeylogin未定义。另外获取token后是否要自己再在服务端定义函数获取用户手机号? ...

oneKeyLogin只在ios端有效,使用方法请参考demo。
获取token后要到自己的服务器端获取手机号。

主题:
0
帖子:
5
云币:
6
发表于 2020-3-4 09:57:08 |
这个不支持自己写的 h5 页面么,! 只能 修改原生页面的内容是么

驾校小白

UID:817587

主题:
2
帖子:
16
云币:
18
 楼主| 发表于 2020-3-4 14:46:09 |
无为书生 发表于 2020-3-4 09:57
这个不支持自己写的 h5 页面么,! 只能 修改原生页面的内容是么

是的,不支持自定义h5页面,只能修改原生页面的样式。

实习司机

UID:841924

主题:
43
帖子:
127
云币:
170
发表于 2020-7-29 12:10:47 |
microtown 发表于 2020-3-4 14:46
是的,不支持自定义h5页面,只能修改原生页面的样式。

这个怎么后台解析token,获取电话号码呀,能有后台案例看一下嘛!

驾校小白

UID:725388

主题:
5
帖子:
28
云币:
23
发表于 2020-7-31 16:18:57 |
你好 这个 logo 能替换为自己的吗

驾校小白

UID:725388

主题:
5
帖子:
28
云币:
23
发表于 2020-8-4 09:49:49 |
大佬你好  我想用这个模块吗 方便留下联系方式 有很多问题不是太明白
12下一页
您需要登录后才可以回帖 登录 | 立即注册

快速回复 返回顶部 返回列表