uniapp开发android app使用阿里云手机号一键登录教程

一  下载 阿里云号码认证SDK  插件

https://ext.dcloud.net.cn/plugin?id=4297

二 解压 copy以下目录到自己的uniapp项目中

nativeplugins 

common

三 在Hbuilder中打开 manifest.json 后,在 "安卓/iOS 原生插件配置" 选择本地插件,选中"阿里云号码认证SDK"

四 打包自定义基座 

  在manifest.json 的权限配置中选择需要的权限后

  选择Hbuilder的"运行 -> 运行到手机或模拟器 -> 制作自定义调试基座 "

记下 Android包名,使用云端证书 ,选择"打自定义调试基座" "传统打包" 进行在线打包

五 进入阿里云 "号码认证服务" 设置密钥

https://dypns.console.aliyun.com/solution/All

在 "号码认证服务"->"号码认证服务"->号码认证方案管理 中 新增号码认证方案

方案名称 任意

APP名称 最好和uniapp 名称一致

包名 见第四步

包签名 获取步骤 : 签名获取工具 https://help.aliyun.com/document_detail/2256433.html?spm=5176.11662647.0.0.107154b87MMVMR#title-wjo-8o0-xl8 

首先将 打包好的自定义基座 安装到手机上

然后安装签名获取工具 ,打开 签名获取工具 "AppSignGet" ,点击　＂选择安装包＂ 根据第四步的包名,选中之后,点击 "获取包签名" ,然后点击"复制到剪切板"即可

备注:手机有可能因权限问题,签名获取工具,无法选择安装包,请自行添加访问权限

在添加完方案后,点击 "密钥" 复制

六 在项目App.vue中的onLaunch中进行号码认证SDK的初始化

    onLaunch: function () {
        let sdkInfo = '';  //密钥变量
        let platform = uni.getSystemInfoSync().platform;
        //设置秘钥
        if (platform == 'android') {
            const aLiSDKModule = uni.requireNativePlugin('AliCloud-NirvanaPns');
            //开启SDK日志打印
            aLiSDKModule.setLoggerEnable(true);
            aLiSDKModule.expandAuthPageCheckedScope(true);
            //禁用物理返回键
            //aLiSDKModule.closeAuthPageReturnBack(true);
            //开启区分界面返回及物理返回功能，自动控制后续返回事件
            aLiSDKModule.userControlAuthPageCancel();
            //是否跟随系统深色模式
            aLiSDKModule.setAuthPageUseDayLight(false);
            sdkInfo = '这里填入上一步获取的密钥';
            aLiSDKModule.setAuthSDKInfo(sdkInfo);

        }else{
           //非安卓的逻辑
        } 

七 在页面上调用手机号一键登录

<view  @click="goLoginView()">一键登录</view>

    methods: {
        //一键手机号登录
        goLoginView() {
            if (platform == 'android') {
                const aLiSDKModule = uni.requireNativePlugin('AliCloud-NirvanaPns');
                aLiSDKModule.checkEnvAvailable(2, result => {
                    if ('600000' == result.resultCode) {
                        console.log("支持一键登录");
                        uni.navigateTo({
                            animationDuration: 300,
                            url: "../login/login"
                        });
                    } else {
                        console.log("当前环境不支持一键登录，result = ", JSON.stringify(result));
                        uni.showToast({
                            icon: "none",
                            title: result.msg,
                            duration: 3000
                        });
                    }
                });
            }
        },

 八 调用后台接口,进行登录

以示例中的底部弹窗为示例 ,打开login/login.vue中的sheetStyle方法

ui-config.js中的buildSheet 方法中修改一键登录界面,如修改按钮上的文字:

setLoginBtnUi: {
                top: loginBtnTop,
                text: "绑定手机号",

_presentLoginController 方法中进行授权后的后台登录操作

tokenResult => {
            uni.hideLoading();
            console.log(JSON.stringify(tokenResult));
            if ("600001" == tokenResult.resultCode) {
                console.log("授权页拉起成功");
                aLiSDKModule.setCheckboxIsChecked(false);
            } else if ("600000" == tokenResult.resultCode) {
                console.log("获取Token成功，接下来拿着结果里面的Token去服务端换取手机号码，SDK服务到此结束");
                //手动关闭授权页
                aLiSDKModule.quitLoginPage();

 

根据tokenResult.token去调用"云通信号码认证服务" "一键登录取号" 服务端接口 ,根据自己的服务端方案集成相应的代码

https://next.api.aliyun.com/api/Dypnsapi/2017-05-25/GetMobile?RegionId=ap-southeast-1

 九 fastadmin  thinkphp5接入云通信号码认证服务

首先在后台更新云通信的依赖包

composer require alibabacloud/dypnsapi-20170525 1.1.3

引入包含

use AlibabaCloud\SDK\Dypnsapi\V20170525\Dypnsapi;
use AlibabaCloud\Darabonba\Env\Env;
use AlibabaCloud\Tea\Utils\Utils;
use AlibabaCloud\Tea\Console\Console;

use Darabonba\OpenApi\Models\Config as DarabonbaConfig;
use AlibabaCloud\SDK\Dypnsapi\V20170525\Models\GetMobileRequest;

在控制器方法中

        $token = $this->request->post('user_token');

        $config = new DarabonbaConfig([]);
        $config->accessKeyId = "xxxxxxxxx";
        $config->accessKeySecret = "xxxxxxxxxxxxx";
        $client = new Dypnsapi($config);


        $request = new GetMobileRequest([]);
        $request->accessToken = $token;
        $response = $client->getMobile($request);
        $code = $response->body->code;
        if (!Utils::equalString($code, "OK")) {
            $this->error("错误信息:" . $response->body->message . "");
            return null;
        }
        $mobile = $response->body->getMobileResultDTO->mobile;
        $this->success(__('Logged in successful'), ['mobile' => $mobile]);