Login with Twitter
To enable Twitter Auth for your project, you need to set up a Twitter OAuth application and add the application credentials in the Supabase Dashboard.
Overview
Setting up Twitter logins for your application consists of 3 parts:
- Create and configure a Twitter Project and App on the Twitter Developer Dashboard.
- Add your Twitter
API Key
andAPI Secret Key
to your Supabase Project. - Add the login code to your Supabase JS Client App.
Access your Twitter Developer account
- Go to developer.twitter.com.
- Click on
Sign in
at the top right to log in.
Find your callback URL
The next step requires a callback URL, which looks like this: https://<project-ref>.supabase.co/auth/v1/callback
- Go to your Supabase Project Dashboard
- Click on the
Authentication
icon in the left sidebar - Click on
Providers
under the Configuration section - Click on Twitter from the accordion list to expand and you'll find your Callback URL, you can click
Copy
to copy it to the clipboard
Create a Twitter OAuth app
- Click
+ Create Project
.- Enter your project name, click
Next
. - Select your use case, click
Next
. - Enter a description for your project, click
Next
. - Enter a name for your app, click
Next
. - Copy and save your
API Key
(this is yourclient_id
). - Copy and save your
API Secret Key
(this is yourclient_secret
). - Click on
App settings
to proceed to next steps.
- Enter your project name, click
- At the bottom, you will find
User authentication settings
. Click onSet up
. - Under
User authentication settings
, you can configureApp permissions
. - Make sure you turn ON
Request email from users
. - Select
Web App...
as theType of App
. - Under
App info
configure the following.- Enter your
Callback URL
. Check the Find your callback URL section above to learn how to obtain your callback URL. - Enter your
Website URL
(tip: tryhttp://127.0.0.1:port
orhttp://www.localhost:port
during development) - Enter your
Terms of service URL
. - Enter your
Privacy policy URL
.
- Enter your
- Click
Save
.
Enter your Twitter credentials into your Supabase project
- Go to your Supabase Project Dashboard
- In the left sidebar, click the
Authentication
icon (near the top) - Click on
Providers
under the Configuration section - Click on Twitter from the accordion list to expand and turn Twitter Enabled to ON
- Enter your Twitter Client ID and Twitter Client Secret saved in the previous step
- Click
Save