@cryptr/cryptr-spa-js

Statements	Branches	Functions

📚 cryptr-spa.js

Cryptr SDK for Single Page Applications using passwordless authentication

Installation

current version 2.1.0

⚠️ If you do not have access to your Cryptr dashboard using URL like https://dashboard.your-cryptr-service-url.. please use version 1.4.0

//yarn
yarn add @cryptr/cryptr-spa-js

//npm
npm install @cryptr/cryptr-spa-js

Configuration

CryptrConfig

Here is an example of CryptrConfig

var config = {
  tenant_domain: 'your-domain',
  client_id: 'your-api-key-client-id',
  audience: 'http://localhost:8000',
  default_redirect_uri: 'http://localhost:8000/',
  cryptr_base_url: 'https://your_cryptr_server_url',
  dedicated_server: true,
  default_slo_after_revoke: false,
}

Explanation of config

key	Required/Optional	type	Default	Description
tenant_domain	required	string slug	-	Reference to your company entity
client_id	required	uuid	-	Reference to your api key client id
audience	required	string URL	-	Root URL of your front app
default_redirect_uri	required	string URL	-	Desired redirection URL after authentication process
cryptr_base_url	required	string URL	-	URL of your Cryptr service
dedicated_server	Optional	boolean	false	Contact Cryptr Team to set properly
default_slo_after_revoke	required	boolean	false	Set to trueto always proceed SLO while logging out from an SSO session
---	---	---	---	---

⚠️ fixed_pkce has been removed in the 1.4.0 release version

Cryptr Client Instance

After building your config, create your Cryptr client as below:

this.cryptrClient = await CryptrSpa.createClient(config)

After this creation, a quick script is required, contact our team to get it.

Open Session

⚠️ Contact us for more info about this section

This is the latest feature of our SDK and our solutions.

The following methods will allow you to open a session either from the email or the domain of the end-user

Sign with email

If you have the email of the end-user you can call the below method, and depending on whether the email matches an organization or an existing account, the user will be guided into to proper login process (sso, magic link, password ..)

// signature
signInWithEmail(email: string, options?: SsoSignOptsAttrs)

// simple call
signInWithEmail('[e-mail]')

// email and options
signInWithEmail('[e-mail]', { locale: 'fr' })

Sign with domain

If you have the domain of the end user you can call the below method

// signature
signInWithDomain(organizationDomain?: string, options?: SsoSignOptsAttrs)

// simple call
signInWithDomain('some-organization')

// domain + options
signInWithDomain('some-organization', {locale: 'fr'})

Sign in without a domain or email

If you would like to let the user type his email on your Cryptr service

// signature
signIn(options?: SsoSignOptsAttrs)

// simple call
signIn()

// call with options
signIn({ locale: 'fr' })

Close session

When you want to let the user close its session (either Magic Link or SSO) proceed as follows:

To start the process call logOut(callback, location, targetUrl)

Example:

this.cryptrClient.logOut(() => {
  alert('you are logged out')
})

Attribute	Required/Optional	type	Default	Description
callback	optional	Function	-	Process to be called after log out process, ⚠️ Only available in Magic link process due to Redirect process in SSO
location	optional	string URL	window.location	Current location
targetUrl	optional	string URL	window.location.href	URL after Log out process
sloAfterRevoke	optional	boolean	config.default_slo_after_revoke	define if SLO has to be processed after session removal

Fetch User data

You can retrieve current user data properties using getUser()

Example:

this.cryptrClient.getUser()

This method will return you a struct with different properties such as email, user ID or organization domain.

For more information please contact us.

Deleted items

Some legacy items have been deleted since 1.3.0. If you need some support for migration contact us