Skip to main content

OAuth Extension

Overview

Enhance your Web SDK applications by integrating the OAuth Extension, which facilitates seamless incorporation of OAuth capabilities into your projects. This extension enables developers to streamline authentication processes, ensuring secure and efficient user login and session management.

Installation

To install the OAuth Extension for Credenza, use the following npm command:

npm install @credenza3/core-web-oauth-ext
typescript
import { OAuthExtension } from '@credenza3/core-web-oauth-ext';

Create SDK Instance

To create an instance of the SDK with the OAuth Extension, you need to include the OAuthExtension in your configuration. Below is the code snippet to demonstrate this process.

typescript
const sdk = new CredenzaSDK({
  extensions: [new OAuthExtension()],
  // other sdk params
});

Methods and Properties

Login with OAuth2

loginWithRedirect(options: LoginOptions): Promise<void>

The OAuth2 login process with the Credenza SDK allows you to authenticate users and manage sessions efficiently.

Use the sdk.oauth.loginWithRedirect method to initiate the login process. Below is the code snippet:

typescript
await sdk.oauth.loginWithRedirect({
  scope: 'profile email phone blockchain.evm.write blockchain.evm',
  redirectUrl: window.location.href, // must be configured in client settings

  // defines Authentication flow session duration
  // defaults to 1h
  sessionLengthSeconds?: number,

  // explicitly define nonce
  nonce?: string,

  // explicitly define passwordless email. This will skip email enter page and send verification email and navigate user to verification page.
  // only available if `passwordless_type` set to OAuthExtension.PASSWORDLESS_LOGIN_TYPE.EMAIL`
  forceEmail?: string,

  // explicitly define passwordless phone. This will skip phone enter page and send verification sms and navigate user to verification page.
  // only available if `passwordless_type` set to OAuthExtension.PASSWORDLESS_LOGIN_TYPE.PHONE`
  forcePhone?: string

  responseType: string // token || code
  
  // needed in case responseType is CODE to set client server URI which will be responsible for token exchange
  clientServerUri?: string
})

  • scope: Defines the permissions the user will grant. Example: 'profile email phone blockchain.evm.write blockchain.evm'.

  • redirectUrl: URL to redirect users post-login. Must be configured in client settings.

  • sessionLengthSeconds: Duration of the authentication session in seconds. Defaults to 1 hour if not set.

  • responseType : String for a preferred auth response type. Token or Code

  • clientServerUri: String. Needed in case responseType is CODE to set client server URI which will be responsible for token exchange

  • nonce: A unique string to prevent replay attacks.

  • forceEmail: Forces a passwordless login email flow, skipping the email entry page.

  • forcePhone: Forces a passwordless login phone flow, skipping the phone entry page.

Configure your redirectUrl

Make sure to set the 'redirectUrl' in your client settings. It's essential for the OAuth login to work properly.

Destroy OAuth Session

revokeSession(): Promise<void>

To destroy an OAuth session, use the revokeSession method. The user must be logged in before revoking the session.

Code example for revoking an OAuth session:

typescript
await sdk.oauth.revokeSession();

Destroy OAuth Session and browser session

revokeBrowserSessionWithRedirect(redirectUri: string): Promise<void>

To destroy both the OAuth flow session and the browser session, and redirect the user, use revokeBrowserSessionWithRedirect.

Code example for revoking the OAuth flow browser session and redirecting:

typescript
await sdk.oauth.revokeBrowserSessionWithRedirect('<REDIRECT_URI>');