Browser API
The Authsignal Browser API can be used to launch the Authsignal Prebuilt MFA page to let users set up MFA and complete challenges.
Installation
To install the Authsignal client as an npm package, run:
- npm
- Yarn
npm install @authsignal/browser
yarn add @authsignal/browser
This will add our browser library module to your package.json
.
Then you can initialize the Authsignal browser client in your code:
import { Authsignal } from "@authsignal/browser";
const authsignal = new Authsignal({
publishableKey: "YOUR_PUBLISHABLE_KEY",
});
You can find your publishable key in the API Keys section of the Authsignal Portal Settings page.
launch
launch
lets you launch the Authsignal Prebuilt MFA page.
authsignal.launch(url, options);
Usage
- After you’ve made a server-side
track
call you'll get back aurl
which you can pass to the Browser API'slaunch
function.

Pop-up launch option

Redirect launch option
Arguments
Name | Type | Description |
---|---|---|
url | string | The URL which was returned as the result of a track request made using the Authsignal Server API. |
options | LaunchOptions | undefined | The options used when launching the Authsignal Prebuilt MFA page. |
Types
LaunchOptions
type LaunchOptions = {
/**
* How the Authsignal Prebuilt MFA page should launch.
* `popup` will cause it to open in a overlay, whilst `redirect`
* will trigger a full page redirect.
* If no value is supplied, mode defaults to `redirect`.
*/
mode?: "popup" | "redirect";
popupOptions?: {
/** Any valid CSS value for the `width` property. */
width: string;
/** Any valid CSS value for the `height` property. */
height: string;
};
};
TokenPayload
type TokenPayload = {
token?: string;
};
Returns
When mode
is set as popup
it returns a Promise<TokenPayload>
that resolves when the popup closes.
TokenPayload
is an object with a token
property that can be used to verify the outcome of the user action.
Configuration options
popupOptions
Used to configure the dimensions of the popup. Has width
and height
which accept any valid values
for their respective CSS properties. Note that popupOptions
is only available when mode
is set to popup
.
const options: LaunchOptions = {
mode: "popup",
popupOptions: {
width: "500px",
height: "600px",
},
};