JavaScript: Sign in a user through OAuth

Log in an existing user via a third-party provider. This method supports the PKCE flow.

• This method is used for signing in using a third-party provider.
• Supabase supports many different third-party providers.

Parameters

• credentials

  (Required)

Examples

Sign in using a third-party provider

const \{ data, error \} = await supabase.auth.signInWithOAuth(\{
  provider: 'github'
\})

Sign in using a third-party provider with redirect

const \{ data, error \} = await supabase.auth.signInWithOAuth(\{
  provider: 'github',
  options: \{
    redirectTo: 'https://example.com/welcome'
  \}
\})

Sign in with scopes and access provider tokens

// Register this immediately after calling createClient!
// Because signInWithOAuth causes a redirect, you need to fetch the
// provider tokens from the callback.
supabase.auth.onAuthStateChange((event, session) => \{
  if (session && session.provider_token) \{
    window.localStorage.setItem('oauth_provider_token', session.provider_token)
  \}

  if (session && session.provider_refresh_token) \{
    window.localStorage.setItem('oauth_provider_refresh_token', session.provider_refresh_token)
  \}

  if (event === 'SIGNED_OUT') \{
    window.localStorage.removeItem('oauth_provider_token')
    window.localStorage.removeItem('oauth_provider_refresh_token')
  \}
\})

// Call this on your Sign in with GitHub button to initiate OAuth
// with GitHub with the requested elevated scopes.
await supabase.auth.signInWithOAuth(\{
  provider: 'github',
  options: \{
    scopes: 'repo gist notifications'
  \}
\})