时间戳

首页 > 解决方案 > 如何使用 Ionic 框架添加自动 OTP 验证功能？

angular - 如何使用 Ionic 框架添加自动 OTP 验证功能？

问题描述

我制作了一个 Ionic Cordova 应用程序并希望添加自动 OTP 验证功能，该功能会自动从消息收件箱中检索 OTP 并将数字放入 OTP 的输入框中。

这里 OTP 从 API 发送到手机。

先决条件：- 已安装 SMS Retriever 插件： 1>ionic cordova plugin add cordova-plugin-sms-retriever-manager 2>npm install @ionic-native/sms-retriever

你能建议我如何在项目中实现这个功能吗？

标签： angularcordovaionic-framework

解决方案

是的，这是可以实现的。这些是您应该遵循的步骤来实现它：

1 — 创建一个带有虚拟注册流程的示例 Ionic 4 应用程序

2 — 实现 Cordova 插件来读取短信 (cordova-plugin-sms-receive)

3 — 在 android 或 ios 设备上构建应用程序

4 — 测试自动短信读取以批准样本注册

declare var SMSReceive: any; // from Cordova-plugin

然后，您应该将这些事件添加到您的组件中：

  1. SMSReceive.startWatch()
  2. SMSReceive.stopWatch()
  3. 在短信到达
start() {
    SMSReceive.startWatch(
      () => {
        console.log('watch started');
        document.addEventListener('onSMSArrive', (e: any) => {
          var IncomingSMS = e.data;
          console.log(JSON.stringify(IncomingSMS));
        });
      },
      () => { console.log('watch start failed') }
    )
  }

而且，一旦您登录：

SMSReceive.stopWatch(
() => { console.log('watch stopped') },
() => { console.log('watch stop failed') }
)

您可以按照参考资料中的所有步骤进行操作，我已附加到此答案。

SO 不是代码编写，但是，我可以帮助您从这里提供参考，这是我最近用于我们的应用程序的。

推荐阅读