otp_autofill 4.1.0 copy "otp_autofill: ^4.1.0" to clipboard
otp_autofill: ^4.1.0 copied to clipboard

Android implementation of OTP autofill with using User Consent API and Retriever API. Add possibility to receive OTP code from another input.

OTP autofill #

Made by Surf 🏄‍♂️🏄‍♂️🏄‍♂️

Build Status Coverage Status Pub Version Pub Likes Pub popularity Flutter Platform

Overview #

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

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

For testing you could create a TestStrategy.

iOS #

On iOS, the OTP autofill feature is integrated into the TextField component. The code received from an SMS is stored for a duration of 3 minutes.

Rules for sms #

  1. Sms must contain the word code or its translation in iOS supported localizations.
  2. The sms should contain only one sequence of digits.

iOS Testing #

The iOS platform is capable of receiving OTP from any phone number, not just a specific sender.

Android #

  • OTPInteractor.hint - displays a system dialog that allows the user to select from their saved phone numbers (recommendation from Google).
  • OTPInteractor.getAppSignature - creates the hash code of your application, which is used in the SMS Retriever API.
  • OTPInteractor.startListenUserConsent - the broadcast receiver that starts listening for OTP codes using the SMS User Consent API. It listens for a duration of 5 minutes, after which a timeout exception occurs.
  • OTPInteractor.startListenRetriever - the broadcast receiver that starts listening for OTP codes using the SMS Retriever API. It listens for a duration of 5 minutes, after which a timeout exception occurs.
  • OTPInteractor.stopListenForCode - used in dispose.

The plugin is designed to receive the full text of an SMS message and requires a parser to extract the relevant information from the message.

If you use the SMS User Consent API, the system will prompt the user for permission to access and read incoming messages.

  1. The message should contain an alphanumeric string of 4 to 10 characters, with at least one digit.
  2. The message was sent from a phone number that is not in the user's contacts.
  3. If the sender's phone number is specified, the message must originate from that number.

Rules for SMS when using SMS Retriever API #

  1. The length should not exceed 140 bytes.
  2. It should contain a one-time code that the client sends back to your server to complete the verification process.
  3. It should include an 11-character hash string that identifies your app (refer to the documentation for server for more details). For testing, you can obtain it from OTPInteractor.getAppSignature.

Android Testing #

The OTPInteractor.startListenForCode method allows the application to start receiving verification codes from a specific phone number, specified by the senderPhone argument.

You also can use Android Emulator to test the plugin. To do this, you need to send an SMS to the emulator with the following command:

adb emu sms send <senderPhone> <message>

E.g.:

adb emu sms send 900 "Your code is 12345. Do not share it with anyone."

Make sure senderPhone is the same as the one you specified in the startListenForCode method.

Usage #

You should use OTPInteractor to interact with OTP.

To simplify implementation, consider using the OTPTextEditController as a controller for your TextField.

OTPTextEditController.startListenUserConsent - uses the SMS User Consent API and listens to user strategies. OTPTextEditController.startListenRetriever - uses the SMS Retriever API and listens to user strategies. OTPTextEditController.startListenOnlyStrategies - only listens to user strategies. OTPTextEditController.stopListen - used 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 otp_autofill version.

Android Installation #

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

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

Example #

  1. Create a simple strategy
class SampleStrategy extends OTPStrategy {
  @override
  Future<String> listenForCode() {
    return Future.delayed(
      const Duration(seconds: 4),
      () => 'Your code is 54321',
    );
  }
}
  1. Initialize and set the listener
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 receive a new code when a timeout exception occurs, you can pass a callback function to the onTimeOutException parameter and start listen for a new code.

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 significant changes to this project will be documented in this file.

Issues #

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

Contribute #

If you wish to contribute to the package (for instance, by enhancing the documentation, fixing a bug, or introducing a new feature), please review our contribution guide first and then submit your pull request.

Your PRs are always welcome.

How to reach us #

Please don't hesitate to ask any questions about this package. Join our community chat on Telegram. We communicate in both English and Russian.

Telegram

License #

Apache License, Version 2.0

244
likes
160
points
22.1k
downloads

Publisher

verified publishersurf.ru

Weekly Downloads

Android implementation of OTP autofill with using User Consent API and Retriever API. Add possibility to receive OTP code from another input.

Repository (GitHub)
View/report issues
Contributing

Documentation

API reference

License

Apache-2.0 (license)

Dependencies

flutter

More

Packages that depend on otp_autofill