gary-archer/oauth.websample1

Initial SPA and API Code Sample, using OAuth and OpenID Connect

Initial OAuth SPA and API Code Sample

Overview

An introductory standards-based SPA and API code sample, to get integrated with OAuth endpoints:

• The SPA uses the traditional OpenID code flow with PKCE.
• The SPA interacts with an API that validates JWTs and uses claims-based authorization.

Views

The SPA is a simple UI with some basic navigation between views, to render fictional investment resources.

Local Development Quick Start

First ensure that Node.js 20+ is installed.
You must use custom development domains and add this DNS entry to your hosts file:

127.0.0.1 localhost api.authsamples-dev.com

Ensure that Node.js is installed, then run the start script:

./start.sh

The browser is invoked and you can sign in with my AWS test credentials:

• User: guestuser@example.com
• Password: GuestPassword1

Further Information

• See the Sample 1 Overview for a summary of behaviour.
• See the Sample 1 Details for further details on running the code.

2021 Security Update

$\color{red}{\textsf{The initial SPA uses OAuth tokens in JavaScript code, as the simplest way to get integrated.}}$
$\color{red}{\textsf{In 2021 the best practice is to keep tokens out of the browser, to limit the impact of XSS exploits.}}$
See the Final SPA Code Sample for a more secure implementation.

Programming Languages

• The SPA and its views use plain TypeScript code.
• The API uses Node.js and TypeScript.

Infrastructure

• Express is used as the HTTP server for both the API and the SPA's web static content.
• The SPA uses the oidc-client-ts library to implement OpenID Connect.
• The API uses the jose library to validate JWT access tokens.
• AWS Cognito is the default authorization server for the SPA and API.