Custom authentication using phone numbers rather than email
Hello, I'd like to create custom authentication using phone numbers instead of emails where the user would simply get an OTP message to sign-up and sign-in. No need for passwords.
Would this be possible? I understand this is generally out of the project's scope but any general guidance on how I would approach this would be really awesome.
4 Replies
Hi @aspiringaiguy. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Wasp does not currently support passwordless authentication (such as OTP via phone number) out of the box. The built-in authentication methods are email/password, Google, and GitHub. However, the team has indicated that passwordless auth is planned for the future, and the recent integration of Lucia under the hood should make adding new providers easier down the line. For now, you would need to implement this functionality yourself if you want to use phone numbers and OTPs for authentication instead of email/password or social logins Passwordless authentication Discord thread.
For general guidance on implementing phone number authentication with OTP in Wasp, here’s a rough approach based on community discussions:
1. Extend the User Entity: Add a
phoneNumber field (make it unique) and an isPhoneNumberVerified boolean to your User entity.
2. Collect Phone Number During Signup: Customize your signup form to request a phone number instead of an email.
3. Send OTP via SMS: Use an external provider (like Twilio) to send a one-time password (OTP) to the user’s phone number. You’ll need to generate a short-lived token and store it temporarily (either on the user object, a separate entity, or in-memory on the server).
4. Verify OTP: When the user enters the OTP, check it against the stored token. If it matches, set isPhoneNumberVerified to true.
5. Restrict Access: Ensure that only users with a verified phone number can access your app. This should be enforced on the server side, possibly via middleware or per-action/query checks.
This approach has been discussed by the Wasp community, and while it requires some custom implementation, it is feasible. You’ll need to handle the SMS sending and OTP verification logic yourself, as there are no built-in helpers for this in Wasp yet. If you proceed, the Wasp team and community are interested in hearing about your experience and may be able to offer further advice as you go Phone verification Discord thread Twilio SMS API Discord thread.
In summary: Passwordless phone number authentication is not natively supported, but you can build it yourself by extending the user model, customizing the signup flow, and integrating an SMS provider for OTP delivery and verification.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @aspiringaiguy, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?Did the bot's answer help here @aspiringaiguy ?
Sort of. I'm still not entirely sure how to go about this. I understand steps 1-4. However I don't quite get how to restrict access post login.
Im not sure how to create a session for the user after they verify their OTP. Nor how to store the bearer token. Nor how to tie that in with the main.wasp. It's all a bit fuzzy
I did find this gist which I think is a good start. Any other references or advice would be awesome. Thanks Vinny!
Gist
Implementing custom OAuth provider with Wasp 0.14.1+ (Spotify in th...
Implementing custom OAuth provider with Wasp 0.14.1+ (Spotify in this case) - .env.server