SMS verification sign-in with Supabase-AnalyticDB(AnalyticDB)-阿里云帮助中心

SMS one-time password (OTP) sign-in is a widely used method for user authentication.AnalyticDB for PostgreSQL deeply integrates with the open-source Supabase authentication system. In addition to Supabase's native SMS providers, it supports Alibaba Cloud Short Message Service (SMS) to help developers build a fast and stable SMS sign-in capability. This guide shows you how to use Alibaba Cloud Short Message Service to implement SMS sign-in in aAnalyticDB for PostgreSQL Supabase project.

Prerequisites

Create a Supabase project. You have an activeAnalyticDB for PostgreSQL Supabase project that was created after September 30, 2023.
Activate Alibaba Cloud Short Message Service and apply for a sign name and template. For details, seeGetting started. Using Alibaba Cloud Short Message Service incurs costs. For billing information, seeBilling overview.
You have enabled public access for your AnalyticDB for PostgreSQL Supabase project.

Procedure

Log in to the Supabase Dashboard. In the sidebar, clickAuthentication >Sign In/Providers.
UnderAuth Providers, clickPhone.

Configure the SMS service.

Turn onEnable Phone provider.

Enter yourAliyun Access Key ID,Aliyun Access Key Secret,Aliyun SMS Sign Name, andAliyun SMS Template Code. Turn on theEnable phone confirmations switch, and then clickSave.

InSMS provider, select your SMS provider.

This example usesAliyun SMS. The following table describes the parameters. For information about other configuration methods, seePhone Login.

Parameter	Description
Aliyun Access Key ID	The Access Key ID and Access Key Secret for your Alibaba Cloud account. For more information, seeCreate an AccessKey.
Aliyun Access Key Secret
Aliyun SMS Sign Name	The sign name that you applied for in Alibaba Cloud SMS. For more information, seeApply for a sign name.
Aliyun SMS Template Code	The template code that you applied for in Alibaba Cloud SMS. For more information, seeApply for a template.
Enable phone confirmations	When enabled, users must use an OTP to sign in.
SMS OTP Expiry	The expiration time of the OTP, in seconds.
SMS OTP Length	The length of the OTP.
SMS Message	The content of the message template. Enter the message content that matches the template you created in the Alibaba Cloud SMS console. Replace the placeholder for the OTP with`{{ .Code }}`.
Test Phone Numbers and OTPs	Phone numbers and OTPs for testing purposes.

ClickSave. You can now use Alibaba Cloud SMS to send OTPs for sign-in.

Usage

Once configured, you can use one of the following methods to sign in with SMS verification.

API endpoints

Call the sign-up endpoint.

Log in to the Supabase Dashboard. In the upper-left corner of the page, clickConnect, and then clickApp Frameworks in the window that appears to obtain yourSUPABASE_PUBLIC_URL andANON_KEY. The following is an example.
```
curl -X POST 'https://<SUPABASE_PUBLIC_URL>/auth/v1/signup' \
  -H 'apikey: YOUR_ANON_KEY' \
  -H 'Content-Type: application/json' \
  -d '{
    "phone": "+86xxxxxxxxx",
    "password": "password"
  }'
```

After you receive the SMS, verify the OTP.

curl -X POST 'https://<SUPABASE_PUBLIC_URL>/auth/v1/verify' \
  -H 'apikey: YOUR_ANON_KEY' \
  -H 'Content-Type: application/json' \
  -d '{
    "phone": "86xxxxxxxxx",
    "type": "sms",
    "token": "xxxxxx"
  }'

Supabase-js library

For information about how to install and use supabase-js, seesupabase-js.

Call the sign-up method.

const { data, error } = await supabase.auth.signUp(
  {
    phone: '+86xxxxxxxxx',
    password: 'password',
    options: {
      data: {
        first_name: 'John',
        age: 27,
      }
    }
  }
)

After you receive the SMS, verify the OTP.

const { data, error } = await supabase.auth.verifyOtp({ phone, token, type: 'sms'})