Topics

Tribe Support

Tribe Support's Topics

Maro  Ma

Maro Ma

February 06 2021

Twilio-Anahita Phone Signup/Sign-ins via sms code

Rastin et al

We want to implement Twilio-Anahita Phone Signup/Sign-ins via SMS code

Here is the User Story:

USER SIGNUP (Registration)

A first time user selects the Flag/Country his mobile phone number is registered in and enters his/her Mobile Phone [+Country Code Area Code Phone Number]

Twilio then sends the user a one-time passcode to his/her mobile phone via SMS. The user then enters the code on our website to complete their registration. 

Immediately upon registration (first-time login) an Anahita User page is "auto-generated" showing : 

[Avatar/Photo Placeholder] 

[Country Flag] [+Country Code Area Code Phone Number]

and the rest of the Anahita User page fields 

SUBSEQUENT SIGN-INS

After the initial session has expired, a returning user can access his/her account and use our website by repeating the same process: select country, enter the mobile number, receive a code via SMS,  add code to the page,  and is logged in- again- until the session expires. Anytime a session expires or is killed and the client is reloaded the

The same procedure needs to happen. Account data is persistent from initial signup to subsequent sign-ins for a seamless and easy UX. The idea is to create a community of Mobile Phone Users

Please advise how to proceed given the current state of Anahita code+pluginsThanks in advance note: A similar use case was described by Akgora Flip in his post dated May 12 2020 Want to add a mobile number for the signup and sign in processhttps://www.getanahita.com/topics/168154-want-to-add-mobile-number-for-signup-and-sign-in-processWould be interested in knowing if a Twilio-Anahita plugin was ever developed or in in the works by Akgora Flip and/or any other members #Twilio #Signup #Authentication #Onboarrding #Registration #Mobile #TwoFactorAuthentication #TwoFA #SMS
  • 8 Comments
  • Last Comment by Maro Ma
  • Rastin Mehr liked this
Rastin Mehr
Rastin Mehr
February 07 2021 Permalink
We've never integrated with Twilio because for the projects that we have done, Twilio wouldn't have passed the user privacy compliance. Still, I realize that mobile signup and 2FA are very convenient for business to consumer projects. So I can give you some tips:

1. Build your UI and UX workflow in a clientside technology as a mobile, browser, or desktop app. Do not rely on the existing HTML views in Anahita. As soon as the Anahita React app is ready, we will remove all the HTML views in Anahita and make it available as a RESTful API only service.

2. DO NOT store user phone numbers in Anahita. It's better if a big-budget company such as Twilio handles phone numbers because, one would hope, that they have better infrastructure and budget to protect users' data. What you do is to first register the user with Twilio by providing them with the user's email and phone number, and then obtain a Twilio user id, then store the Twilio user id in Anahita's person object as metadata like this:

$person->setValue("twilio_user_id", $twilio_user_id);

and obtain it:

$person->getValue("twilio_user_id");

3. Anahita plugins provide a series of hooks or events that you can use. You need to develop a Twilio User Plugin and Twilio Authentication Plugin. The first one is used for sign up and keeping the account information updated, and the authentication plugin is for authenticating the user against Twilio API.

Here are the list of hooks in an Anahita User plugin: https://github.com/anahitasocial/anahita/blob/master/src/plugins/user/anahita.php

And there is only one hook in the Anahita Authentication plugin, which is "onAuthenticate": https://github.com/anahitasocial/anahita/blob/master/src/plugins/authentication/anahita.php
Rastin Mehr
Rastin Mehr
February 07 2021 Permalink
So here is how the UI/UX workflow works. In your client app, design a signup form that includes a phone number field and email. In your Twilio User Plugin, in the method onAfterAddPerson, register the user with Twilio, obtain a user id from them and store it in your person object for later use.

Twilio will send an SMS message with a code to the phone number:

In your Twilio Authentication plugin, in the onAuthenticate method, pass the code to the Twilio API and listen to the response. If the response was a success, create an Anahita session for the user and log them in. Basically, instead of checking user credentials (username, password), we are using Twilio's temporary code to authenticate the user.
Rastin Mehr
Rastin Mehr
February 07 2021 Permalink
And one last tip, you can build your own People package and store it in the packages directory with the other apps. Basically, it will be your own custom com_people. When you are installing Anahita, she will use your custom com_people instead of the default com_people.

I hope this helped!
Maro  Ma
Maro Ma
February 12 2021 Permalink
Thanks You Rastin . I'll have my team look at your instructions and let you know if any questions. Has a an “Anahita-Twilio plugin” already been developed by Angora Flip or any other member? https://www.getanahita.com/topics/168154-want-to-add-mobile-number-for-signup-and-sign-in-processWould
Rastin Mehr liked this
Rastin Mehr
Rastin Mehr
February 16 2021 Permalink
This is good and if you had any questions, you can post them on this topic. I'm not aware of any Twilio integrations happening in the community. You seem to be the first one.
Maro  Ma
Maro Ma
April 14 2021 Permalink
Rastin @rastin It seems your community member “Akgora Flip @Atest” June 26 2020 successfully implemented, under your guidance and direction, this same exact solution we are looking to make using Twilio Authy Users API https://www.getanahita.com/topics/168300-addiition-of-extra-field-of-phone-number-in-signup#scroll=168364

Are these implementation instructions/guidelines you gave to them still valid? or has something updated/changed in the code?
Rastin Mehr
Rastin Mehr
April 14 2021 Permalink
The only guidance that I provided was on this group. The plugin architecture hasn't changed much, so you should be able to build an implementation for yourself using the existing code in the master branch.
Unknown Person liked this
Maro  Ma
Maro Ma
April 15 2021 Permalink
Got it. Thank You Rastin
Rastin Mehr liked this

Powered by Anahita