Social login
Add Dropbox as an OAuth login option alongside other social providers.
Better Auth · Const
dropbox
Dropbox sign-in is configured as a Better Auth social provider with a Dropbox client ID and client secret. Clients start the flow with signIn.social({ provider: "dropbox" }).
How it works
Dropbox is registered under socialProviders with a client ID and client secret. The client starts authentication by calling signIn.social with provider set to dropbox, after which Better Auth handles the OAuth flow and callback.
Syntax
betterAuth({ socialProviders: { dropbox: { clientId, clientSecret } } });
authClient.signIn.social({ provider: "dropbox" });Parameters
| Name | Type | Description |
|---|---|---|
clientId | string | Dropbox OAuth client identifier from the Dropbox Developer Portal. |
clientSecret | string | Dropbox OAuth client secret from the Dropbox Developer Portal. |
provider | "dropbox" | Social provider identifier; set this to dropbox. |
Key points
- Dropbox authentication requires both a client ID and a client secret.
- Create or retrieve the credentials through the Dropbox Developer Portal.
- The Dropbox App Console can be configured to allow Implicit Grant & PKCE.
- Register Dropbox in the auth configuration's socialProviders collection.
- The sign-in method receives an options object rather than a bare provider string.
- Set the sign-in options object's provider field to dropbox.
Common mistakes
- Register the local callback URL exactly as shown in the Dropbox application settings.
- Changing Better Auth's auth-route base path requires changing Dropbox's registered redirect URL too.
Example: Configure Dropbox sign-in
import { betterAuth } from "better-auth";
import { createAuthClient } from "better-auth/client";
export const auth = betterAuth({
socialProviders: {
dropbox: {
clientId: process.env.DROPBOX_CLIENT_ID!,
clientSecret: process.env.DROPBOX_CLIENT_SECRET!,
},
},
});
const authClient = createAuthClient();
await authClient.signIn.social({ provider: "dropbox" });Configure Dropbox with its credentials, then start the OAuth sign-in flow through the client.
When to use it
Passwordless provider authentication
Let users authenticate through Dropbox instead of creating a local password.
Client sign-in
Start a browser-based Dropbox authorization flow from a Better Auth client.
Interview questions
QHow do you configure Dropbox in Better Auth?
The provider is enabled by adding a dropbox entry to the auth instance's socialProviders option. That entry requires clientId and clientSecret values.
Follow-up: How would you begin authentication from the browser? Call the client signIn.social method with an object whose provider is set to dropbox.
QHow does a client sign in with Dropbox?
Use createAuthClient to create the client, then call authClient.signIn.social with provider set to dropbox. This starts the provider sign-in flow.
Follow-up: What configuration must Dropbox receive for the flow to return successfully? Its application must register the matching Better Auth callback URL.
QWhat external Dropbox setup is required?
Dropbox requires a client ID and client secret, obtained from the Dropbox Developer Portal. The application can also allow Implicit Grant & PKCE in Dropbox's App Console.
Follow-up: What must change if the auth route base path changes? Update the Dropbox redirect URL to reflect the new callback path.
Related
socialProviderssignIn.socialcreateAuthClientclientIdclientSecret