Add Okta OIDC authentication to a web application using Datawiza in 5 mins

September 2, 2021
Weiyu Fang
Okta OIDC authentication to a web application using Datawiza

Traditionally, securing web applications by integrating them with cloud Identity Providers (IdPs) has been a difficult task. It requires an understanding of cybersecurity best practices, OIDC/SAML protocols, and more. It also demands precious engineering time, as well as learning multiple types of SDKs distributed by the IdPs. And companies that try to take shortcuts risk poor implementations that create potential security vulnerabilities.

An easier way to secure applications with Okta

In our previous article, we introduced how to secure an application with Auth0 and Datawiza in 5 minutes using a configuration-based approach rather than coding. In addition, Datawiza supports many other IdPs, such as Azure AD, Azure AD B2C, Keycloak, and so on.

In this tutorial, you will learn how to implement OpenID Connect (OIDC) SSO authentication for a web application with Okta and Datawiza. “Application” here refers to Regular Web Applications that perform most of their application logic on the server (e.g., ASP.NET, PHP, or JAVA, Golang, Python). Mobile applications (iOS and Android) and Single Page Applications (e.g., AngularJS, Node.js, or React) are not included.

Introduction to the Datawiza Platform

The Datawiza Platform is a cloud-delivered, SaaS-based access management solution. It includes a data plane and a control plane: Datawiza Access Broker (DAB) and Datawiza Cloud Management Console (DCMC), respectively.

DAB is a lightweight, container-based access proxy deployed close to your application via the sidecar (agent) or gateway mode. It talks to Okta on behalf of your applications, so you don’t need to worry about the integration work. DCMC is a cloud-based management console where you can configure and manage the policies of DABs. Unlike traditional Web Access Management (WAM) solutions (CA Siteminder, Oracle Access Manager, IBM), our SaaS-based design makes the entire platform much easier to access and use.

How to set up Okta for OIDC? 

It may be one of the most frequently asked questions when people want to secure their applications with Okta. With Okta app integrations, admins can securely connect users to external applications and systems, and manage single sign-on (SSO) options as well as user lifecycle operations, including advanced on-boarding, device, and license management options.

Create an app integration in Okta

First, we need to create an Okta app integration in the Okta console. When performing this step, make sure to log in to your account on Okta. Visit the link here to create a developer account.

You can skip this step if you already have an app integration with the following values: Okta Org, Client ID, and Client Secret.

  1. Create an app integration after you log in to Okta.
  1. Choose OIDC-OpenID Connect as Sign-in method and Web Application as Application type, then click Next.
  1. Fill out the form and give your app integration a descriptive name (e.g., Header base application demo). Follow the steps below:
  • Base URIs: e.g., http://localhost:9772
  • Login redirect URIs: e.g., http://localhost:9772/authorization-code/callback
  • Logout redirect URIs: e.g., http://localhost:9772
  • Others remain default settings
  • Then click Save

On the general information setting page, make a copy of the Client ID and Client secret under the Client Credentials section. You will need these two codes later to build up the connection.

In the upper-right corner, locate the organization URL, which takes the form of https://your_domain.okta.com. Save this URL as Okta Org.

Confirm that members are linked to the right applications. If not, choose Assign Applications to manually add them.


You have now registered a web application on Okta. Next, you will create a simple configuration in the DCMC.

Simple configurations using Datawiza Cloud Management Console

First, log in to the Datawiza Cloud Management Console (DCMC). If you do not have a DCMC account, you can create one by email from the DCMC login page. Also, we provide social login functionality with Microsoft, GitHub, and Google to simplify logins for you.

The Get started function will guide you through the configuration. After logging in to the DCMC, click on the yellow “Get started” button and follow the steps.

Enter some basic information, such as the deployment name and provisioning key name:

Now Add an Application:

Configure your application with the following values:

Note that Upstream Servers is the address of the application for which you want to enable SSO. In this tutorial, we will provide a header-based app running on port 3001.

Next Configure the IdP:

Select OIDC as the Protocol and Okta as the Identity Provider. Input the Okta Org, Client ID, and the Client Secret you saved when creating the app in Okta. Then click Create.

In the last step, we will provide the command lines to pull the DAB image and the docker-compose file to run the DAB.

NOTE: In this tutorial, we use Docker and docker-compose to deploy the DAB. Please ensure that you have already installed both of them in your environment before running the DAB.

Execute the command lines in steps 1 & 2 and note down the docker-compose file in step 3.

Run DAB as a sidecar (agent) to your application

After finishing the configuration in DCMC, you can run the DAB with the YAML file noted down in the previous step. In this part of the tutorial, we need to add our header-based app to the YAML file for testing purposes. The final docker-compose YAML file should look like this:


version: '3'
services:
datawiza-access-broker:
  image: registry.gitlab.com/datawiza/access-broker
  container_name: datawiza-access-broker
  restart: always
  ports:
    -- "9772:9772"
  environment:
    PROVISIONING_KEY: #############################
    PROVISIONING_SECRET: #############################
header-based-app:
  image: registry.gitlab.com/datawiza/header-based-app
  container_name: ab-demo-header-app
  restart: always
  ports:
    -- "3001:3001"

Now, we can use docker-compose to create and start the DAB:

docker-compose -f datawiza-access-broker up -d

That’s it. After executing the command above, the header-based app should have SSO enabled with Okta.

Now, let’s give it a try.

Open a browser and type in http://localhost:9772. You should see the Okta login page as follows. Use the test user we created in the previous step to log in.

After logging in to Okta, the header-based app will be shown.

Summary

This tutorial has shown you how to secure a web application with Okta using Datawiza — in minutes instead of hours or days. Get a free trial by signing up/in here. Please email us at contact@datawiza.com if you need any help or have any questions.

DOWNLOAD IN PDF