Repository files navigation

Twilio Verify Push SDK helps you verify users by adding a low-friction, secure, cost-effective, "push verification" factor into your own mobile application. This fully managed API service allows you to seamlessly verify users in-app via a secure channel, without the risks, hassles or costs of One-Time Passcodes (OTPs).This project provides a library to implement Verify Push for your react native app.

React native 0.66.5

• Add the library to your project:

yarn add https://github.com/twilio/twilio-verify-for-react-native.git

• Install the pods for your project

npx pod-install

If you want to receive challenges as push notifications, you should register Your App with APNs.

More infohere

If you want to receive challenges as push notifications, you should add a firebase configuration to your project

• Add a project in Firebase to use cloud messaging for an application ID
• Add the google-services.json file to your project

More infohere

After setting up push notifications for Android & iOS, you should add a react native library to receive notifications from APN for iOS and FCM for Android.

The example app is usingreact-native-push-notification, you can find the full example sourcehere

importTwilioVerify,{PushFactorPayload}from'@twilio/twilio-verify-for-react-native';letfactor=awaitTwilioVerify.createFactor(newPushFactorPayload(factorName,verifyServiceSid,identity,accessToken,pushToken));

awaitTwilioVerify.verifyFactor(newVerifyPushFactorPayload(factor.sid));

letchallenge=awaitTwilioVerify.getChallenge(challengeSid,factorSid);

awaitTwilioVerify.updateChallenge(newUpdatePushChallengePayload(factorSid,challengeSid,newStatus));

letfactors=awaitTwilioVerify.getAllFactors();

letchallenges=awaitTwilioVerify.getAllChallenges(newChallengeListPayload(factorSid,10,ChallengeStatus.Pending,ChallengeListOrder.Desc));

awaitTwilioVerify.deleteFactor(factorSid);

You can clear local storage calling theTwilioVerify.clearLocalStorage method:

awaitTwilioVerify.clearLocalStorage();

Note: Calling this method will not delete factors inVerify Push API, so you need to delete them from your backend to prevent invalid/deleted factors when getting factors for an identity.

Install the packages in thetwilio-verify-for-react-native project

yarn install

Install the packages in theexample app

cd exampleyarn install

• Go toexample and install the pods

cd examplenpx pod-install

• Change the Bundle Identifier to something unique so Apple’s push notification server can direct pushes to this app

• Enable push notifications

• Get theAccess token generation URL from your backend(Running the sample backend). You will use it for creating a factor

• Run iOS app intwilio-verify-for-react-native root folder

yarn example ios

NOTE: There could be incompatibility issues with the react native version and your environment, so running the project from Xcode could share more details about the error and how to fix it

• Follow the steps fromFirebase configuration, follow steps 1 to 3

  • For step 3.1, the google-services.json file should be copied to example/android/app
  • Google services plugin is included in the sample app, so you don't need step 3.2

• Get theAccess Token generation URL from your backend(Running the Sample backend). You will use it for creating a factor

• Run Android app intwilio-verify-for-react-native root folder

yarn example android

• Configure a Push Credential for the sample app, using the same Firebase project you configured forAndroid, and using the same APNs configuration foriOS
• Configure a Verify Service, using the Push Credential for the sample app (Android &iOS)
• Go to:https://www.twilio.com/code-exchange/verify-push-backend
• Use theQuick Deploy to Twilio option
  • You should log in to your Twilio account
  • Enter the Verify Service Sid you created above, you can find ithere
  • Deploy the application
  • PressGo to live application
  • You will see your backend's start page, copy the url and replaceindex.html withaccess-token.(e.g.https://verify-push-backend-xxxxx.twil.io/access-token). This will be yourAccess Token generation URL

• Press Create factor in the factor list
• Enter the identity to use. This value should be an UUID that identifies the user to prevent PII information use
• Enter the Access token URL (Access token generation URL, including the path, e.g.https://verify-push-backend-xxxxx.twil.io/access-token)
• Press Create factor
• Copy the factor Sid

• Go toCreate a push challenge section in your sample backend (https://verify-push-backend-xxxxx.twil.io/index.html)
• Enter theIdentity you used in factor creation
• Enter theFactor Sid you added
• Enter amessage. You will see the message in the push notification and in the challenge view
• Enter details to the challenge. You will see them in the challenge view. You can add more details using theAdd more Details button
• PressCreate challenge button
• You will receive a push notification showing the challenge message in your device.
• The app will show the challenge info below the factor information, in aChallenge section
• Approve or deny the challenge
• After the challenge is updated, you will see the challenge status in the backend'sCreate a push challenge section, asLogin request approved! orLogin request denied!, below theCreate challenge button

Android

iOS