identity-browser-sdk

The browser SDK for Vulos Identity

Usage

This is an example on how you would use the browser SDK.

Assuming you are using WebPack to bundle the code.

// Import the library
import { Application, User } from "@vulos/identity-base"
import { FrontendAuth } from "@vulos/identity-browser-sdk";

// Create the application object
const auth = new Application({
    id: "<paste your_client id here>",
    secret: "<paste your client secret here>",
    scope: "<paste your scopes here>",
    redirectUrls: ["<your website's callback URL>,"]
}).createAuth(FrontendAuth)

// Connect to the Vulos Identity server
await auth.connect()

// ... somewhere in a route that is supposed 
// to redirect the user to the generated URL ...
async function handleRedirectRequest() {
    // Create the request verifier
    // NOTE: You should store the value of this in a database 
    // or distributed cache, and generate one per authentication request
    const verifier = auth.createVerifier()

    // pseudo-code:
    // Generate a random ID
    const authenticationRequestId = generateRandomId()

    // Store the verifier to local storage
    localStorage.setItem('verifier', JSON.stringify(verifier))
    
    // Create the authorization URL, and redirect to it
    window.location = await auth.createAuthUrl(verifier)
}


// ... somewhere in the callback URL route ...
async function handleCallbackRequest() {
    // Get the verifier from localStorage
    const verifier = JSON.parse(localStorage.getItem('verifier'))
    
    // Remove it because we don't need it anymore
    localStorage.removeItem('verifier')

    // Process the callback and get the user from the query params
    const user = await auth.processCallback(verifier, document.location.search)
    
    // Put the tokens in an object that doesn't self-reference
    const userTokens = user.save()
    
    // Save the tokens for future use
    localStorage.setItem('tokens', JSON.stringify(userTokens))
    
    redirect('/somewhere-else')
}

// This is supposed to be an example route that shows how to use the SDK
async function exampleRoute() {
    // Get the tokens from local storage
    const tokens = JSON.parse(localStorage.getItem('tokens'));
    
    // Create a new user object that you can use to interact with the API
    const user = new User(auth, tokens);

    // Attempt to do stuff with the user
    try {
        // We are getting the user information again
        const info = await user.info()
        /* Do something with it here */

        // For example, here's how you'd get all the organization names where
        // you are a super admin (that you own)
        const ownedOrganizationNames = []
        const memberships = await user.getOrganizationMemberships()
        for(const membership of memberships) {
            const roles = await membership.getRoles()
            for(const role of roles) {
                if (role.name === "SuperAdmin") {
                    const organization = await membership.getOrganization()
                    ownedOrganizationNames.push(organization.name)
                    break
                }
            }
        }
        /* Do something with ownedOrganizationNames */
    } finally {
        // Save the user to the database, just in case the tokens got updated
        localStorage.setItem('tokens', JSON.stringify(user.save()))
    }
}