Skip to content

v1.0.0 - Zero-Permission SMS OTP Verification for Android

Choose a tag to compare

@pushpender-singh-ap pushpender-singh-ap released this 01 Oct 00:40
· 7 commits to main since this release
2575e4d

πŸŽ‰ Initial Release - SMS OTP Verification for React Native Android

Automatic SMS OTP verification using Google's SMS Retriever API and SMS User Consent API with zero permissions required.


✨ Key Features

  • πŸ” Two verification methods: Automatic (SMS Retriever) and User-Consent based
  • 🚫 Zero permissions: No READ_SMS or RECEIVE_SMS needed
  • βœ… Google Play approved: Uses official Google Play Services APIs
  • 🎯 Easy integration: Simple JavaScript API with full TypeScript support
  • πŸ“± Android only: iOS throws descriptive error
  • πŸ”„ Event-driven: Real-time SMS listening with callbacks
  • πŸ› οΈ Modern architecture: Built with React Native TurboModules

πŸ“¦ Installation

npm install @pushpendersingh/react-native-otp-verify

or

yarn add @pushpendersingh/react-native-otp-verify

πŸš€ Quick Start

import { 
  startSmsRetriever, 
  addSmsListener, 
  getAppSignature, 
  extractOtp 
} from '@pushpendersingh/react-native-otp-verify';

// Get app signature for your backend
const signature = await getAppSignature();

// Start listening for SMS
await startSmsRetriever();

// Listen for incoming OTP
const removeListener = addSmsListener((message) => {
  if (message.status === 'success') {
    const otp = extractOtp(message.message);
    console.log('OTP:', otp);
  }
});

🎯 What's Included

Native Implementation (Kotlin)

  • βœ… SMS Retriever API integration
  • βœ… SMS User Consent API integration
  • βœ… App signature hash generator (11-character Base64)
  • βœ… BroadcastReceiver for SMS events
  • βœ… Activity result handling for consent dialogs
  • βœ… Android API 19+ support

JavaScript API

  • βœ… startSmsRetriever() - Start automatic SMS listening
  • βœ… getAppSignature() - Get app hash for SMS formatting
  • βœ… requestPhoneNumber() - Start consent-based verification
  • βœ… addSmsListener() - Listen for SMS events
  • βœ… removeSmsListener() - Stop listening
  • βœ… extractOtp() - Extract OTP with custom regex support

Documentation

  • βœ… Comprehensive README with all APIs documented
  • βœ… Complete usage examples (Automatic & Consent-based)
  • βœ… Backend integration guide (Node.js example)
  • βœ… SMS format specifications
  • βœ… Troubleshooting guide
  • βœ… Full TypeScript definitions

Example App

  • βœ… Simple demo app with both verification methods
  • βœ… Live testing examples
  • βœ… Clear implementation patterns

πŸ“‹ API Overview

SMS Retriever (Automatic)

Perfect when you control the SMS format. Captures OTP automatically without user interaction.

// Your backend sends SMS like this:
// <#> Your OTP is: 123456
// 
// FA+9qCX9VSu

await startSmsRetriever();
const removeListener = addSmsListener((message) => {
  const otp = extractOtp(message.message); // "123456"
});

SMS User Consent (Dialog-based)

Works with any SMS format. Shows Google consent dialog - user taps "Allow" to share SMS.

// Works with any SMS format:
// "Your verification code is 123456"

await requestPhoneNumber();
const removeListener = addSmsListener((message) => {
  if (message.status === 'success') {
    const otp = extractOtp(message.message); // "123456"
  }
});

πŸ”§ Requirements

  • React Native >= 0.76+
  • Android API Level >= 24
  • Google Play Services

πŸ†š Comparison: SMS Retriever vs SMS User Consent

Feature SMS Retriever SMS User Consent
User Action None (Automatic) Tap "Allow"
SMS Format Requires app hash Any format
User Experience Seamless One-tap consent
Best For Your own backend 3rd party SMS
Permission Zero Zero

πŸ›‘οΈ Zero Permissions

Both APIs use Google Play Services and require zero permissions in AndroidManifest.xml.

<!-- AndroidManifest.xml -->
<manifest>
  <!-- No READ_SMS -->
  <!-- No RECEIVE_SMS -->
  <!-- No special permissions needed! -->
</manifest>

πŸ”§ Backend Integration

SMS Format for SMS Retriever

<#> Your OTP is: 123456

YOUR_APP_SIGNATURE

Node.js Example

const signature = 'FA+9qCX9VSu'; // Get from getAppSignature()
const otp = '123456';

const sms = `<#> Your OTP is: ${otp}

${signature}`;

// Send via your SMS provider (Twilio, AWS SNS, etc.)
await sendSMS(phoneNumber, sms);

πŸ› Bug Reports & Feature Requests

If you find any issues or have feature requests, please open an issue.


🀝 Contributing

Contributions are welcome! See CONTRIBUTING.md for guidelines.


πŸ“„ License

MIT - See LICENSE for details.


πŸ™ Credits