Skip to main content

Seamless Login

Version Requirements​

  • MiniApp SDK Version: >= 2.0.0 (npm package @wcm/mini-app-sdk)
  • MiniApp Runtime Engine Version: >= 3.0.0

Basic Usage​

To implement seamless login in your MiniApp, follow these steps:

  1. Import and instantiate the MiniAppAuthClient:
import { MiniAppAuthClient } from "@wcm/mini-app-sdk/auth";

// Create a single instance of authClient for use throughout your app
export const authClient = new MiniAppAuthClient();
  1. Initiate the sign-in process:
// Call this at your app's entry point, preferably before rendering
await authClient.signInFromWindowLocation();
  1. Access user credentials:
console.log("idToken": authClient.tokens.idToken);
console.log("accessToken": authClient.tokens.accessToken);
console.log("refreshToken": authClient.tokens.refreshToken);

Advanced Usage​

Auto refresh config​

By default, the accessToken is automatically refreshed. In case you need to receive the tokens once and handle on your own the refresh token then you can disable the auto refresh mechanism when initiating the authClient like this:

export const authClient = new MiniAppAuthClient({ useAutoRefresh: false });

Env config​

By default the authClient is configured to use prod env which means the MiniApp will only run on top of the prod Woven City App. In case you need to run the MiniApp on top of "stage" or "dev" version of the Woven City App then you should setup that when initiating the authClient like this:

export const authClient = new MiniAppAuthClient({ env: "stage" });

NextAuth​

If you are using NextAuth, make sure to disable auto refresh and you can pass the credentials to the signIn method and handle the auth logic in the server side authorize method.

When you need to refresh the token, use the following API:

curl -X 'POST' 'https://mini-app-api.lab.woven-city.toyota/mini-app-runtime/v2/auth/refresh'
-H 'accept: application/json'
-H 'Content-Type: application/json'
-d '{ "refresh_token": "{YOUR_REFRESH_TOKEN}" }'
  • This endpoint will return a new refresh token, access token, and ID token.
  • For the first refresh, replace {YOUR_REFRESH_TOKEN} with the refresh token you got from: const refreshToken = authClient.tokens.refreshToken;
  • For subsequent refreshes, use the new refresh token you received from the previous refresh call.

Note: When using manual refresh, it's your responsibility to handle token expiration and refreshing. Make sure to securely store and manage your refresh tokens.