Skip to content
Zautha

Hosted login only

Every instance has its own sign-in and sign-up pages (the hosted login), on its host: ….accounts.zautha.com for a development instance, your own subdomain (such as accounts.example.com) for a production one. Your app sends the user there and gets them back signed in.

Before you start

Section titled “Before you start”
  • An application in the dashboard. Its publishable key is on the instance’s API keys page (or its overview). The hosted login needs no secret key: that one is for servers.

Install

Section titled “Install”
Terminal window
npm i @zautha/js

Add the code

Section titled “Add the code”
src/main.js
import { Zautha } from "@zautha/js";


const zautha = new Zautha("pk_test_...");
await zautha.load();


if (!zautha.isSignedIn) {
  // Goes to https://your-app.accounts.zautha.com/sign-in?redirect_url=<this page> and comes back signed in.
  zautha.redirectToSignIn();
}

redirectToSignIn() sends the user to the hosted /sign-in with your page as redirect_url; after signing in they come back there, signed in. The URL must be on one of the instance’s allowed origins (localhost on a development instance, your domain on a production one; see origin_invalid).

The hosted login follows the instance’s branding (logo, color, theme) from the dashboard’s Branding page. Its other pages are /sign-up, the user’s account page /user, and /organization and /create-organization when organizations are on.

Run it

Section titled “Run it”

Start your app, open it signed out and call redirectToSignIn(). You land on the hosted sign-in; sign up there. A development instance accepts localhost as it is; addresses ending in +zautha_test before the @ (such as jane+zautha_test@example.com) get no email and verify with the code 424242. After signing in you are back on your page.

Without JavaScript in your app

Section titled “Without JavaScript in your app”

Any OpenID Connect library can sign users in with the instance instead: see OIDC.

Next steps

Section titled “Next steps”