Social providers
The Auth UI supports 27 OAuth providers through Better Auth. Each one you turn on adds a “Sign in with …” button to the sign-in form, and signed-in users can link it to their account from the user profile.
Turn on a provider
Each provider takes three steps.
Set its key to
true:src/convex/auth.constants.tsCreate an OAuth app in the provider’s developer console. Its Better Auth guide, linked in the table below, shows where. Follow only the part that gets you the credentials:
src/convex/auth.tsalready configures every provider.Set the credentials in Convex:
Set them on every Convex deployment (development, preview, production), and register each environment’s callback URL with the provider.
Callback URL
Register this redirect URL in the provider’s OAuth app:
Sign-in requests go through your app’s /api/auth/[...all] route to Convex, so the callback is on your app’s domain, not on .convex.site. Locally that’s http://localhost:5173, for example http://localhost:5173/api/auth/callback/githubhttp://localhost:3000, for example http://localhost:3000/api/auth/callback/github.
The provider id is the AUTH_CONSTANTS key, except for X, whose Better Auth id is twitter: https://<your-app>/api/auth/callback/twitter.
Supported providers
Credentials are named <KEY>_CLIENT_ID and <KEY>_CLIENT_SECRET, with the key in capitals. TikTok is the exception: it takes a client key, TIKTOK_CLIENT_KEY.
| Key | Provider | Convex environment variables |
|---|---|---|
apple | Apple | APPLE_CLIENT_ID, APPLE_CLIENT_SECRET |
atlassian | Atlassian | ATLASSIAN_CLIENT_ID, ATLASSIAN_CLIENT_SECRET |
discord | Discord | DISCORD_CLIENT_ID, DISCORD_CLIENT_SECRET |
dropbox | Dropbox | DROPBOX_CLIENT_ID, DROPBOX_CLIENT_SECRET |
facebook | FACEBOOK_CLIENT_ID, FACEBOOK_CLIENT_SECRET | |
figma | Figma | FIGMA_CLIENT_ID, FIGMA_CLIENT_SECRET |
github | GitHub | GITHUB_CLIENT_ID, GITHUB_CLIENT_SECRET |
gitlab | GitLab | GITLAB_CLIENT_ID, GITLAB_CLIENT_SECRET |
google | GOOGLE_CLIENT_ID, GOOGLE_CLIENT_SECRET | |
huggingface | Hugging Face | HUGGINGFACE_CLIENT_ID, HUGGINGFACE_CLIENT_SECRET |
kakao | Kakao | KAKAO_CLIENT_ID, KAKAO_CLIENT_SECRET |
kick | Kick | KICK_CLIENT_ID, KICK_CLIENT_SECRET |
line | LINE | LINE_CLIENT_ID, LINE_CLIENT_SECRET |
linear | Linear | LINEAR_CLIENT_ID, LINEAR_CLIENT_SECRET |
naver | Naver | NAVER_CLIENT_ID, NAVER_CLIENT_SECRET |
notion | Notion | NOTION_CLIENT_ID, NOTION_CLIENT_SECRET |
paypal | PayPal | PAYPAL_CLIENT_ID, PAYPAL_CLIENT_SECRET |
reddit | REDDIT_CLIENT_ID, REDDIT_CLIENT_SECRET | |
roblox | Roblox | ROBLOX_CLIENT_ID, ROBLOX_CLIENT_SECRET |
salesforce | Salesforce | SALESFORCE_CLIENT_ID, SALESFORCE_CLIENT_SECRET |
slack | Slack | SLACK_CLIENT_ID, SLACK_CLIENT_SECRET |
spotify | Spotify | SPOTIFY_CLIENT_ID, SPOTIFY_CLIENT_SECRET |
tiktok | TikTok | TIKTOK_CLIENT_KEY, TIKTOK_CLIENT_SECRET |
twitch | Twitch | TWITCH_CLIENT_ID, TWITCH_CLIENT_SECRET |
vk | VK | VK_CLIENT_ID, VK_CLIENT_SECRET |
x | X | X_CLIENT_ID, X_CLIENT_SECRET |
zoom | Zoom | ZOOM_CLIENT_ID, ZOOM_CLIENT_SECRET |
Related
- Configure features: every flag and environment variable.
- <UserProfile />: where users link and unlink providers.