Skip to content

Sign Up Flow

You can implement authentication by either building your own UI or using the provided UI. For company products, we recommend using the provided UI.

  1. Redirect to the Sign Up page:

    const url =
    "https://auth-frontend.beyul.io/sign-up?returnURL=" +
    encodeURIComponent("http://localhost:3000/dashboard");
    redirect(url);
  2. After successfully signing up and verifying email and signing in, user will be redirected to your return URL with a base64 encoded authenticated user.

    http://localhost:3000/dashboard?code=eyJVc2VyIjp7IklEIjoidXNlcl8wMUo2WFE0NEhZM0ROOE5a......;
  3. After you get the code from the URL parameters decode it to get the authenticated user object.

    const decodedData = JSON.parse(atob(decodeURIComponent(code)));
  4. You will get the Object as follows:

    {
    "User": {
    "ID": "user_01J5Z8MJ2VBXQZ1B82NQDD0H7Q",
    "Email": "test@gmail.com",
    "EmailVerified": true,
    "FirstName": "",
    "LastName": "",
    "ProfilePictureURL": "",
    "CreatedAt": "2024-08-23T09:21:17.401Z",
    "UpdatedAt": "2024-08-25T07:49:02.368Z"
    },
    "OrganizationID": "org_01J5ZDMPZHR21NK52FNT416D1Z",
    "RefreshToken": "i2LFI8baG0B0ru1qbk8xjQk8i",
    "AccessToken": "eyJhbGciOiJSUzI1NiIsImtpZCI6InNzb19vaWRjX2tleV9wYWlyXzAxSjQxSlNTRTdLVDhFNVhHNzRQREhENU1GIn0.eyJpc3MiOiJodHRwczovL2FwaS53b3Jrb
    3MuY29tIiwic3ViIjoidXNlcl8wMUo1WjhNSjJWQlhRWjFCODJOUUREMEg3USIsInNpZCI6InNlc3Npb25fMDFKNjQ4NTZaOUZOSjJCSEpIOTZXQVFaN0UiLCJqdGkiOiIwMUo2NDg1Nz
    BERDVNVFA0RzcyREtNUDI5WCIsIm9yZ19pZCI6Im9yZ18wMUo1WkRNUFpIUjIxTks1MkZOVDQxNkQxWiIsInJvbGUiOiJhZG1pbiIsImV4cCI6MTcyNDU3MjQ0NiwiaWF0IjoxNzI0NTcy
    MTQ2fQ.MS-4-ne5pq1V0KZ1WHXVZQgRAqyaFiYkXQhsXVZhOOqYedSMeDLMsz6DnEG-Fx7HfLMc-BU_am7IinDZuDbMpuaMxVYsk6InsVItEbQVT5wJKtTBdplUr8yEVLjZfy5MMNrSNZq
    uPIO186beDvL9AVazvodFiaD35b3BMdIynTwGT1FL2PSMVhEguFW05eDVZUobJ6WSzqg9_wTRfWlE8HbRsMdvpmdkhKqFErRG8NaDG_vMlXoBfDics8zM39Hy9tOBnbP0AvxCjYSFNjZ28
    7eGrgeAYfFqzSD00MKkxE0iUgz16QQHpAa-1q5WUBPSp4B6WIfCV8EE3w3C2MwRRg"
    }
  5. You can save the Refresh and Access Tokens in your cache or cookie to use them later.

  6. Next time this user visits your site check if you have a refresh token in your cache. If so, use it to get a new access token and refresh token. If not redirct to the login page.

  7. If the refresh token exits authenticate the user with it. If a error is returned it means that the session has ended so redirect to the login page.