1. Frontend
  • Overview
  • Application Guides
    • Frontend
      • Get Started - React App
      • Get Started - HTML and JS
      • Get Started - Angular JS
      • Get Started - Next JS App
    • Backend
      • Get Started - Node JS
      • Get Started - Golang
      • Get Started - ASP.NET
      • Get Started - JAVA
  • Dashboard
    • API Credentials
    • Organization
    • Social Login
    • Customize Email Template
    • Configure Custom Domain
    • IT Admin Portal
  • Authentication
    • Login Widget
    • Magic Link
    • Google Social Login
    • Multi-Factor Authentication
    • Single Sign-On Overview
    • Setup SSO Connection
  • Security
    • Overview
    • Authentication
      • Password Hashing and Storage
      • Multi-Factor Authentication Methods and Implementation
      • Session Management
    • Attack Protection
      • Bot Detection
      • Breached Password Detection
      • Brute Force Protection
      • Log Events
      • Secure JSON Web Tokens (JWT)
      • Secure OpenID Connect (OIDC)
      • Suspicious IP Throttling
    • Data Security
      • Data Encryption At Rest and In Transit
      • Secure Storage of Secrets (Keys, Credentials)
      • Sensitive Data Handling
    • Infrastructure
      • Security Considerations for Cloud Provider or Deployment Model
      • Threat Modeling
  • API References
    • Authentication
      • MagicLink
        • Email a Magic Link
        • Resend Email Magic Link
        • Verify Magic Link
        • Ping Status
      • Magic Auth Code
        • Email a Magic Auth Code
        • Resend Magic Auth Code
        • Verify Magic Auth Code
      • Phone Authentication
        • Send Magic Auth Code via SMS
        • Resend Magic Auth Code via SMS
        • Phone Magic Auth Verify
      • PassKey
        • Initiate Passkey Login
        • Passkey Registration Initialize
        • Finish Passkey Authentication
        • Complete Passkey Registration
        • Check User Passkey Authentication Status
        • List User PassKey Credentials
        • Update Passkey Name
        • Delete Associated Passkey
      • GET Auth Status
    • Token
      • Refresh Token
      • Access Token By Auth Code
    • Mutli-Factor Authentication (MFA)
      • MFA Access Token
      • List of Authenticators
      • MFA Enroll TOTP
      • Initiate MFA
      • QR Code Image API
      • Validate MFA Token
      • Get Backup Code
    • Role And Permission
      • List All Roles
      • List All Permission
      • Create New Role
      • Update Existing Role
      • Update Permission By Permission Id
      • Remove Organization Role By Role Id
      • Remove Organization Permission By Permission Id
    • User Management
      • List All Users
      • GET User By User Id
      • GET User by User Email Address
      • Create a User
      • Update User by User Id
      • Verify User Status By User Id
      • Delete User By User Id
      • Manage User Roles
      • GET Users Organizations
      • GET User Login Logs
    • Organization
      • Add New Organization
      • Get Organization
      • Get All Organization
      • Update Organization
      • Delete Organization
      • GET Configuration By Client Id
      • GET Configuration By Custom Domain
  1. Frontend

Get Started - React App

Get Your Login Page URL#

Access the SSOJet Dashboard
Navigate to the Branding section of your SSOJET dashboard.
Select the Widgets section
Click on the Try Now Button , it will redirect to your Login Page. Use this URL to login your users into your application.

Configure The Redirect URL#

Configuring the redirect URL is a crucial step in setting up your authentication flow, ensuring that users are properly redirected back to your application after successful authentication. Below is a detailed guide on how to configure the redirect URL for your application:

Understanding the Redirect URL#

Purpose: The redirect URL is the endpoint in your application where users are sent after they have authenticated successfully through the authentication provider.
Usage: It ensures a seamless transition back to your application, allowing you to handle the authentication response and proceed with your custom logic.
Determine the endpoint in your application that will handle the authentication response. This is typically a route dedicated to processing the authentication token or code.
Example redirect URL: /auth/callback

Setting Up the Redirect URL#

Navigate to the API Settings section of your SSOJet dashboard.
Select the Domain section.
Enter the your application redirect URL.
image.png
The default authentication method support for Login page is magic link. Configuring and enabling any SSO connections from SSOJet dashboard (e.g., Okta, AzureAd, etc.), will get displayed on your Login Page.

Handling Redirection#

After successfully verifying the magic link, your user will be redirected to your application's specified redirect URL, with the state parameter included in the query string. The state ID is used to get the token for successful login, check the exmaple below:
Example
Example React Code snippet will get state query parameter value and request the SSOJet magic link status API.
https://api.ssojet.com/api/v1/auth/passwordless/magic-link/status?state=<state>.
This API will return access token after successful verification and authentication status of the user.
Modified at 2024-07-24 12:12:49
Previous
Overview
Next
Get Started - HTML and JS
Built with