FLASHAUTHby JAGWAR

Authentication Deep Dive

Follow the step-by-step flow of how FlashAuth securely authenticates a user from start to finish.

Prerequisites

1
Step 1: Initialize FlashAuth SDK

Initialize the FlashAuth SDK in your frontend by passing your FlashAuth Client ID.

import FlashAuthClient from 'flashauthbyjagwar';
import { useState, useEffect } from 'react';

const [client, setClient] = useState(null);

useEffect(() => {
  const flashauthClient = new FlashAuthClient("flashauth_client_id");
  setClient(flashauthClient);    
}, []);
2
Step 2: SDK Calls Authentication API

The FlashAuth SDK automatically calls the authentication API on the FlashAuth Backend to begin the login process.

const HandleGoogleSignIn = async () => {
  if (!client) return;
  try {
    let userData = await client.SignInWithGoogle();
    userData = jwtDecode(userData);
    setUser(userData);
  } catch (error) {
    console.error("Google Sign-In Error:", error);
  }
};
3
Step 3: FlashAuth SDK opens OAuth Popup

The FlashAuth SDK will open an OAuth Account selection popup for the user.

4
Step 4: Backend Generates Auth URL

The FlashAuth backend fetches your credentials from the FlashAuth database, generates a Google Auth URL, and returns it to the SDK to open a popup.

// FIND USER CREDENTIALS 
const userCredentialCollection = req.db.model('UserCredentials', UserCredentials);
const siteData = await userCredentialCollection.findOne({clientPublicKey: clientPublicKey});

if(!siteData){
    return res.status(400).json({success: false, message: "INTERNAL SERVER ERROR: Site data not found, Contact Admin"});
}

let {googleClientId, googleClientSecret} = siteData;  

googleClientId = Decrypt(googleClientId);
googleClientSecret = Decrypt(googleClientSecret);

const oAuthClientInstance = new OAuth2Client(
    googleClientId,
    googleClientSecret,
    "https://jagwar-flash-auth.onrender.com/api/flashauth/google/callback"
);
const authURL = oAuthClientInstance.generateAuthUrl({
    access_type: "offline",
    scope: ["profile", "email"],
    prompt: "select_account",
    state: clientPublicKey
});
5
Step 5: User Authenticates with Google

The user chooses their Google account in the popup, and upon success, Google calls the /api/flashauth/google/callback endpoint on the FlashAuth server.

6
Step 6: Backend Creates User

The FlashAuth backend creates a new user record in your own application's database.

// TRY CREATE / UPDATE USER IN CLIENT's MONGODB
const createOrUpdateInDb = await findOrCreate(clientMongoDbUri, userProfile);
7
Step 7: Token Returned to Frontend

A secure JWT authentication token is generated and returned to your frontend application. The user is now successfully logged in!