OTP autofill #

This package is part of the SurfGear toolkit made by Surf.

Description #

This plugin uses SMS User Consent API and SMS Retriever API on Android.

You could use autofill from another input by using OTPStrategy. (e.g. from push-notification).

For testing you could create TestStrategy.

iOS #

On iOS OTP autofill is built in TextField. Code from sms stores for 3 minutes.

Rules for sms #

1. Sms must contain the word code or it translation to ios supported localizations.
2. Must be only one digit sequence in sms.

iOS Testing #

iOS can receive number from any other number.

Android #

OTPInteractor.hint - show system dialog to select saved phone numbers (recommendation from google). OTPInteractor.getAppSignature - create hash-code of your application, that used in SMS Retriever API. OTPInteractor.startListenUserConsent - BroadcastReceiver start listen for code from Google Services for 5 minutes. Above 5 minutes raise timeout exception. Using SMS User Consent API. OTPInteractor.startListenRetriever - BroadcastReceiver start listen for code from Google Services for 5 minutes. Above 5 minutes raise timeout exception. Using SMS Retriever API. OTPInteractor.stopListenForCode - use in dispose.

Plugin receive full sms text, need parser for sms.

If you use SMS User Consent API then system ask for permission to reed incoming message.

Rules for sms. SMS User Consent API #

1. The message contains a 4-10 character alphanumeric string with at least one number.
2. The message was sent by a phone number that's not in the user's contacts.
3. If you specified the sender's phone number, the message was sent by that number.

Rules for sms. SMS Retriever API #

1. Be no longer than 140 bytes.
2. Contain a one-time code that the client sends back to your server to complete the verification flow.
3. Include an 11-character hash string that identifies your app (documentation for server, for testing you can get in from OTPInteractor.getAppSignature).

Android Testing #

OTPInteractor.startListenForCode has senderPhone argument. Application start receiving code from this number.

Usage #

You could user OTPInteractor to interact with OTP.

For easy implementation you could use OTPTextEditController as a controller to your TextField.

OTPTextEditController.startListenUserConsent - use SMS User Consent API, and custom strategies. OTPTextEditController.startListenRetriever - use SMS Retriever API, and custom strategies. OTPTextEditController.startListenOnlyStrategies - listen only custom strategies. OTPTextEditController.stopListen - use in dispose.

Installation #

Add otp_autofill to your pubspec.yaml file:

dependencies:
  otp_autofill: $currentVersion$

At this moment, the current version of otp_autofill is .

Android Installation #

Set minSdkVersion at least to 19 in <project root>/project/android/app/build.gradle.

android {
  ...
  defaultConfig {
    ...
    minSdkVersion 19
    ...
  }
  ...
}

Example #

1. Create simple strategy

class SampleStrategy extends OTPStrategy {
  @override
  Future<String> listenForCode() {
    return Future.delayed(
      const Duration(seconds: 4),
      () => 'Your code is 54321',
    );
  }
}

2. Initialize listener and set

late OTPTextEditController controller;
final scaffoldKey = GlobalKey();

@override
void initState() {
  super.initState();
  _otpInteractor = OTPInteractor();
  _otpInteractor.getAppSignature()
      .then((value) => print('signature - $value'));
  controller = OTPTextEditController(
    codeLength: 5,
    onCodeReceive: (code) => print('Your Application receive code - $code'),
  )..startListenUserConsent(
      (code) {
        final exp = RegExp(r'(\d{5})');
        return exp.stringMatch(code ?? '') ?? '';
      },
      strategies: [
        SampleStrategy(),
      ],
    );
}

Send new code #

To get new code you can pass callback onTimeout Exception to detect and process this situation.

controller = OTPTextEditController(
      codeLength: 5,
      onCodeReceive: (code) => print('Your Application receive code - $code'),
      otpInteractor: _otpInteractor,
      onTimeOutException: () {
        //TODO: start new listen to get new code
        controller.startListenUserConsent(
          (code) {
            final exp = RegExp(r'(\d{5})');
            return exp.stringMatch(code ?? '') ?? '';
          },
          strategies: [
            SampleStrategy(),
          ],
        );
      },
    )..startListenUserConsent(
        (code) {
          final exp = RegExp(r'(\d{5})');
          return exp.stringMatch(code ?? '') ?? '';
        },
        strategies: [
          TimeoutStrategy(),
        ],
      );

Changelog #

All notable changes to this project will be documented in this file.

Issues #

To report your issues, submit them directly in the Issues section.

Contribute #

If you would like to contribute to the package (e.g. by improving the documentation, fixing a bug or adding a cool new feature), please read our contribution guide first and send us your pull request.

Your PRs are always welcome.

How to reach us #

Please feel free to ask any questions about this package. Join our community chat on Telegram. We speak English and Russian.

License #

Apache License, Version 2.0