Add Strava sign-in
Users authenticate with their Strava accounts in a Next.js application.
Auth.js · Const
Strava
Strava is a built-in Auth.js OAuth provider. Add it to the providers list and supply credentials through AUTH_STRAVA_ID and AUTH_STRAVA_SECRET or explicit provider options.
How it works
The Strava provider is a built-in OAuth integration. Add it to the Auth.js providers list; Auth.js can obtain its client credentials from the provider-specific environment variables, then use Strava's callback endpoint to complete sign-in.
Syntax
function default<P extends StravaProfile>(options: OAuthUserConfig<P>): OAuthConfig<P>Parameters
| Name | Type | Description |
|---|---|---|
options | OAuthUserConfig<P> | Configuration options for the Strava OAuth provider. |
Returns
OAuthConfig<P>
Key points
- Auth.js supplies Strava as a built-in provider rather than requiring a custom OAuth provider definition.
- The standard environment variables for Strava are AUTH_STRAVA_ID and AUTH_STRAVA_SECRET.
- The provider's purpose is to add Strava sign-in to an Auth.js application.
- The provider factory accepts options and produces an OAuth configuration, with the profile type parameter extending StravaProfile.
Common mistakes
- Strava is configured as OAuth 2 by default; custom protocol behavior requires overriding the built-in provider configuration.
- The callback URL must use the Strava-specific callback path and be registered with the provider.
Example: Configure Strava with NextAuth
import NextAuth from "next-auth"
import Strava from "next-auth/providers/strava"
export const { handlers, auth, signIn, signOut } = NextAuth({
providers: [Strava],
})Registers Strava as an OAuth provider using the inferred AUTH_STRAVA_ID and AUTH_STRAVA_SECRET environment variables.
When to use it
Use environment-based credentials
A deployment stores provider credentials outside source code.
Customize the provider configuration
An application needs provider-specific profile typing or OAuth overrides.
Interview questions
QHow do you add Strava authentication in Next.js?
Strava is enabled by adding the built-in Strava provider to the Auth.js providers array. In a Next.js application, the provider can be imported from next-auth/providers/strava and passed as Strava.
Follow-up: How are credentials supplied without passing options? Auth.js infers them from AUTH_STRAVA_ID and AUTH_STRAVA_SECRET.
QWhat callback URL must be configured?
The provider's callback URL is https://example.com/api/auth/callback/strava for a Next.js deployment. The hostname must be replaced with the application's real origin and the URL configured with Strava.
Follow-up: What changes for another supported framework? Use that framework's callback path shown in the provider setup documentation rather than the Next.js path.
QWhat are the provider's types and return value?
The provider factory accepts OAuthUserConfig<P> and returns OAuthConfig<P>, where P extends StravaProfile. StravaProfile includes firstname, lastname, id, and profile fields.
Follow-up: When would you provide an explicit generic profile type? Use one when extending or narrowing the profile shape consumed by the provider configuration.
Related
StravaProfileOAuthConfigOAuthUserConfigconfiguring a built-in OAuth provider