Start OAuth Flow - Stytch Docs

import { useStytch } from '@stytch/react';

export const Login = () => {
const stytch = useStytch();

const startOAuth = () =>
  stytch.oauth.google.start({
    login_redirect_url: '${exampleURL}/authenticate',
    signup_redirect_url: '${exampleURL}/authenticate',
    custom_scopes: [
      'https://www.googleapis.com/auth/documents.readonly',
      'https://www.googleapis.com/auth/drive.readonly',
    ],
    provider_params: {
      login_hint: 'example_hint@stytch.com',
    },
  });

return <button onClick={startOAuth}>Log in with Google</button>;
};

import { useStytch } from '@stytch/react';

export const Login = () => {
const stytch = useStytch();

const startOAuth = () =>
  stytch.oauth.google.start({
    login_redirect_url: '${exampleURL}/authenticate',
    signup_redirect_url: '${exampleURL}/authenticate',
    custom_scopes: [
      'https://www.googleapis.com/auth/documents.readonly',
      'https://www.googleapis.com/auth/drive.readonly',
    ],
    provider_params: {
      login_hint: 'example_hint@stytch.com',
    },
  });

return <button onClick={startOAuth}>Log in with Google</button>;
};

import { useStytch } from '@stytch/react';

export const Login = () => {
const stytch = useStytch();

const startOAuth = () =>
  stytch.oauth.google.start({
    login_redirect_url: '${exampleURL}/authenticate',
    signup_redirect_url: '${exampleURL}/authenticate',
    custom_scopes: [
      'https://www.googleapis.com/auth/documents.readonly',
      'https://www.googleapis.com/auth/drive.readonly',
    ],
    provider_params: {
      login_hint: 'example_hint@stytch.com',
    },
  });

return <button onClick={startOAuth}>Log in with Google</button>;
};

The oauth.$provider.start() methods start OAuth flows by redirecting the browser to one of Stytch’s oauth start endpoints. The method will also generate a PKCE code_verifier and store it in local storage on the device (See the PKCE OAuth guide for details). If your application is configured to use a custom subdomain with Stytch, it will be used automatically.

oauth.amazon.start()
oauth.apple.start()
oauth.bitbucket.start()
oauth.coinbase.start()
oauth.discord.start()
oauth.facebook.start()
oauth.github.start()
oauth.gitlab.start()
oauth.google.start()
oauth.linkedin.start()
oauth.microsoft.start()
oauth.salesforce.start()
oauth.slack.start()
oauth.twitch.start()
oauth.yahoo.start()

Parameters

configuration

object

Additional configuration.

Show properties

The URL Stytch redirects to after the OAuth flow is completed for a user that already exists. This URL should be a route in your application which will run oauth.authenticate (see below) and finish the login.The URL must be configured as a Login URL in the Redirect URL page. If the field is not specified, the default Login URL will be used.

The URL Stytch redirects to after the OAuth flow is completed for a user that does not yet exist. This URL should be a route in your application which will run oauth.authenticate (see below) and finish the login.The URL must be configured as a Signup URL in the Redirect URL page. If the field is not specified, the default Signup URL will be used.

custom_scopes

string

Include a space separated list of custom scopes that you’d like to include. Note that this list must be URL encoded, i.e. the spaces must be expressed as %20.

provider_params

object

An object containing parameters that you’d like to pass along to the OAuth provider. For example, some OAuth providers support a login_hint parameter that allows you to pre-populate the OAuth login flow with a suggested email address. We recommend consulting each OAuth provider’s documentation for a list of supported parameters. The keys in the provider_params object are the parameter names (like login_hint), and their values are the data that you’d like to pass along for each parameter (like example_hint@stytch.com).

oauth_attach_token

string

A single-use token for connecting the Stytch User selection from an OAuth Attach request to the corresponding OAuth Start request.

Response

success

boolean

Whether the OAuth flow was started successfully.

error

Error

The error object if the OAuth flow was not started successfully.

reason

string

If error, the reason for the error. One of User Canceled, Authentication Failed, or Invalid Platform.

⌘I

​Parameters

​Response

Parameters

Response