@criipto/auth-js

Accept logins from MitID, NemID, Swedish BankID, Norwegian BankID and other e-ID providers in your Javascript app with @criipto/auth-js.

Index

• Install
• Usage
• Auth
• Auth.popup
• Auth.redirect

Install

npm install --save @criipto/auth-js

Usage

import CriiptoAuth from "@criipto/auth-js";
import "@criipto/auth-js/index.css";

var criiptoAuth = new CriiptoAuth({
  domain: "{YOUR_CRIIPTO_DOMAIN}",
  clientID: "{YOUR_CRIIPTO_APPLICATION_ID}",
  store: sessionStorage,
});

criiptoAuth.popup.authorize({
  width: 300,
  height: 400,
  redirectUri: "http://localhost:8000/example/popup-callback.html",
  acrValues: "urn:grn:authn:dk:mitid:substantial",
});

criiptoAuth.redirect.authorize({
  redirectUri: "http://localhost:8000/example/index.html",
  acrValues: "urn:grn:authn:dk:mitid:substantial",
});

Auth

Initialize/Constructor

var criiptoAuth = new CriiptoAuth({
  domain: "{YOUR_CRIIPTO_DOMAIN}",
  clientID: "{YOUR_CRIIPTO_APPLICATION_ID}",
  store: sessionStorage,
});

var criiptoAuth = new CriiptoAuth({
  domain: "{YOUR_CRIIPTO_DOMAIN}",
  clientID: "{YOUR_CRIIPTO_APPLICATION_ID}",
  store: sessionStorage,
  redirectUri: "http://localhost:8000/example/index.html",
  acrValues: "urn:grn:authn:dk:mitid:substantial",
});

Parameters:

• domain (required, string): The domain which your Criipto Application belongs to, such as example.criipto.id.
• clientID (required, string): The Client ID/realm for your Criipto Application.
• additional authorization parameters: See Authorization parameters

Authorization parameters

All authorization methods like criiptoAuth.popup.authorize, criiptoAuth.redirect.authorize and criiptoAuth.authorizeResponsive take a set of authorization parameters. These authorization parameters can also be provided by default via the CriiptoAuth constructor.

• redirectUri (string): The URL where Criipto will call back to with the result of a successful or failed authentication. It must be whitelisted in the "Callback URLs" in your Criipto application settings.
• acrValues (string): What EID to use for authentication, such as urn:grn:authn:dk:mitid:substantial, a list of acceptable values can be found at https://{YOUR_CRIIPTO_DOMAIN}/.well-known/openid-configuration

authorizeResponsive

criiptoAuth.authorizeResponsive({
  "(min-width: 768px)": {
    via: "popup",
    redirectUri: "http://localhost:8000/example/popup-callback.html",
    acrValues: "urn:grn:authn:dk:mitid:substantial",
    width: 320,
    height: 460,
  },
  "(max-width: 767px)": {
    via: "redirect",
    redirectUri: "http://localhost:8000/example/index.html",
    acrValues: "urn:grn:authn:dk:mitid:substantial",
  },
});

Provides a convenient way to pick authorization method (popup or redirect) based on a CSS media query (screen size).

• {[mediaQuery: string]: {via: 'popup' | 'redirect', Authorization parameters}}

Auth.popup

authorize

const response = await criiptoAuth.popup.authorize({
  width: 300,
  height: 400,
  redirectUri: "http://localhost:8000/example/popup-callback.html",
  acrValues: "urn:grn:authn:dk:mitid:substantial",
  /** Using a random state is helpful,
   * if your users are able to
   * trigger new popups while a request
   * is still pending */
  state: Math.random().toString(),
});
console.log(response.id_token, response.claims);

• width (optional, number): Width of the popup.
• height (optional, number): Height of the popup
• Authorization parameters

Auth.redirect

authorize

criiptoAuth.redirect.authorize({
  redirectUri: "http://localhost:8000/example/index.html",
  acrValues: "urn:grn:authn:dk:mitid:substantial",
});

Redirects the users browser tab to the authorization url. After authorization the user will be redirected back to the provided redirectUri.

• Authorization parameters

match

const match = await criiptoAuth.redirect.match();
console.log(match.code);
console.log(match.id_token, match.claims);

Returns an object with a code or id_token key if present in the window.location search (query params) or hash.

Logout

If you have SSO enabled for your domain and you are not using prompt=login you can use logout() to clear the users SSO session.

criiptoAuth.logout({
  redirectUri: "http://localhost:8000/example/index.html",
});