# Single-Page Applications

## Overview

JavaScript applications running in a browser are often hard to secure due to the open nature of the Web. Secure storage is nonexistent, and everything is in clear text (for HTTP version 1.1). Here's a quote from the Azure Active Directory team that summarizes the state of authentication with single-page applications:

> The OAuth2 implicit grant is notorious for being the grant with the longest list of security concerns in the OAuth2 specification. And yet, that is the approach implemented by ADAL JS and the one we recommend when writing SPA applications. What gives? It’s all a matter of tradeoffs: and as it turns out, the implicit grant is the best approach you can pursue for applications that consume a Web API via JavaScript from a browser.
>
> (Source: <https://docs.microsoft.com/en-us/azure/active-directory/develop/active-directory-dev-understanding-oauth2-implicit-grant>)

It's therefore important that you make all of the necessary checks to verify the validity of your requests and the responses.

This section provides instructions on how to configure Okta with a single-page application (SPA) so that users can authenticate through it and make requests to the WorkflowGen GraphQL API. This configuration is done in two steps: registering your SPA, then setting some redirect URLs.

### Prerequisites <a href="#prerequisites-single-page-applications" id="prerequisites-single-page-applications"></a>

* Make sure to have a licensed copy of WorkflowGen installed and running on a server.
* Make sure to have administrative access to Okta to be able to configure it properly.
* Make sure to have provisioned an existing Okta user with which you can authenticate to WorkflowGen so that you can use the application afterwards.
* Make sure to have successfully configured delegated authentication to Okta on your WorkflowGen instance following the instructions in the [Okta authentication](https://docs.workflowgen.com/tech/10.0/okta-integration/authentication) section.

## Okta configuration <a href="#okta-configuration-single-page-applications" id="okta-configuration-single-page-applications"></a>

### Create a new single-page application

1. In your Okta developer portal, go to the **Applications** item under the **Applications** menu, then click the **Create App Integration** button.<br>
2. Select the **OIDC - OpenID Connect** sign-in method, select **Single-Page Application** as the application type, then click **Next**.\
   \
   ![](https://content.gitbook.com/content/2sHxsrPmYoHfTyABKAbS/blobs/gvhBMLPSyz5Eam1fBPWc/image.png)<br>
3. Enter the following information:
   * **App integration name:** `My SPA`, or the name of your single-page application
   * **Grant type**: Check `Authorization Code`
   * **Sign-in redirect URIs:** The login redirect URI for your single-page application
   * **Sign-out redirect URIs**: The logout redirect URI for your single-page application
   * **Base URIs:** The base URI of your single-page application
   * **Controlled access**: Check `Allow everyone in your organization to access`<br>
4. Click **Save**.

### Review the registration

* You need a `client ID`, which can be found on the **General** tab on your single-page application page.

{% hint style="success" %}
Your application should now successfully linked to the Okta infrastructure and users can log in through it. If you have met the prerequisites, your application will receive an access token that it can send to the WorkflowGen GraphQL API to make authorized requests as a Bearer token via the `Authorization` header.
{% endhint %}