15 Mar, 2024 | 3 min read

Choreo's Managed Authentication for Single-Page Web Applications

  • Omindu Rathnaweera
  • Senior Technical Lead - WSO2


Authentication and authorization play crucial roles in modern application development. Over the years, the way we implement these security measures has evolved, with protocols like OAuth2/OpenID Connect now being widely used. While web applications can manually implement these protocols, it requires a certain level of expertise. Moreover, when it comes to single-page applications (SPAs), additional measures are necessary to securely manage security tokens on the application side.

To simplify authentication and authorization implementation in your Choreo deployed SPAs, we are introducing Choreo's managed authentication. This feature enables developers to effortlessly and securely implement authentication and authorization without diving into the intricacies of security protocols. It also provides a secure backend for the SPA to handle access tokens, eliminating the need for the application to securely store them and attach them to API requests explicitly.

Capabilities of Choreo’s Managed Authentication

  • Setup login and logout functionalities for your SPAs

Your application will have dedicated endpoints for login and logout, making implementation easy. Trigger login and logout operations with a GET request to <app-url>/auth/[login|logout].

  • Retrieve logged-in user information

Obtain logged-in user information through the <app-url>/auth/userinfo endpoint or a short-lived userinfo cookie upon user login.

  • Session management

Configure the session duration of a logged-in user and refresh the access token issued by the IdP via <app-url>/auth/refresh.

  • Secure API invocation

Invoking your APIs in Choreo is straightforward and doesn’t require any additional steps from the web application. API invocations can be done relative to the app URL. i.e The APIs consumed by the application can be invoked via <app-url>/choreo-apis/<api-path>. The authenticated session details of the user will be used during the API invocation to enforce access control for the APIs.

How Choreo's Managed Authentication Works

With Choreo managed authentication, developers can easily configure Choreo to integrate with their preferred identity provider that supports OpenID Connect. Choreo handles all aspects of authentication, including interacting with the identity provider (IdP) for user login/logout, managing user sessions, and securing API invocations.

Once Choreo’s managed authentication is enabled, you can configure your application’s login action to invoke the login endpoint exposed by Choreo. The login endpoint can be accessed through <app-url>/auth/login. When Choreo receives the login request from the application, it interacts with the IdP over the OIDC protocol to complete user authentication and obtain the tokens. Once this is done, a valid authenticated session is created for the user and the user will be redirected to the application with a session cookie. The authenticated session is maintained through a secure http-only cookie. Thereafter, you can access subscribed APIs from your application directly without requiring additional steps in your application code. Choreo will perform the API access control based on the user's authenticated session. It’s worth noting that the endpoints exposed by this feature can be accessed relative to the application URL.

Please refer to the diagram below, which illustrates the functionality discussed above.

  1. The application sends the login request to the login endpoint generated by Choreo.
  2. Choreo directs the user to the identity provider to complete the login.
  3. Once the user completes the authentication, Choreo obtains the access/refresh tokens from the identity provider.
  4. Choreo creates an authenticated session for the user and directs the user back to the application. The authentication session is maintained through a secure session cookie.
  5. After successful authentication, the application can invoke secured APIs relying only on the authenticated session.

Try It Out

In summary, Choreo's managed authentication offers a streamlined approach to setting up authentication for your web application. It provides a quick and secure solution, eliminating the burden of implementing OAuth/OIDC requirements and removing the need to manage tokens issued by the IdPs on the application side.

To explore the full range of Choreo's managed authentication capabilities, we invite you to follow our quick-start guide. For instructions on configuring Choreo's managed authentication for your single-page applications, please refer to our comprehensive documentation.