Get Started - AngularJS

To integrate SSOJet into your AngularJS application, follow these steps. You will need specific details about your application to set up and begin the implementation.

Access the SSOJet Dashboard.

Navigate to the Branding section of your SSOJet dashboard.

Select the Widgets section.

Click on the Try Now button, which will redirect you to your Login Page. Use this URL to log your users into your application.

Configure The Redirect URL

Configuring the redirect URL is essential for your authentication flow, ensuring users are redirected back to your application after successful authentication. Follow the steps below 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 your application redirect URL.

The default authentication method supported for the Login page is a magic link. Configuring and enabling any SSO connections from the SSOJet dashboard (e.g., Okta, AzureAd, etc.), will be 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 a successful login. Check the example below:

Example

This example code snippet shows how to retrieve the state query parameter value and request the SSOJet magic link status API.

API Endpoint:

https://api.ssojet.com/api/v1/auth/passwordless/magic-link/status?state=<state>

This API will return an access token after successful verification and authentication status of the user.

<!DOCTYPE html>
<html lang="en" ng-app="ssojetApp">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>SSOJet Login</title>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
</head>
<body ng-controller="LoginController">
  <div id="login-status">{{loginStatusMessage}}</div>
</body>
</html>

Replace <Your workspace client Id> with your actual client ID. This example demonstrates how to handle the authentication response and display a message to the user based on the authentication status.

Get Started - Angular JS

Get Your Login Page URL#

Configure The Redirect URL#

Understanding the Redirect URL#

Setting Up the Redirect URL#

Handling Redirection#

Get Your Login Page URL

Configure The Redirect URL

Understanding the Redirect URL

Setting Up the Redirect URL

Handling Redirection