JavaScript/SPA Client Applications

When building JavaScript (or SPA) applications, there are two main styles: those with a backend and those without.

JavaScript applications with a backend are more secure, making it the preferred style. This style uses the “Backend For Frontend” pattern, or “BFF” for short, which relies on the backend host to implement all of the security protocol interactions with the token server. The Duende.BFF library is used in this quickstart to easily support the BFF pattern.

JavaScript applications without a backend need to do all the security protocol interactions on the client-side, including driving user authentication and token requests, session and token management, and token storage. This leads to more complex JavaScript, cross-browser incompatibilities, and a considerably higher attack surface. Since this style inherently needs to store security sensitive artifacts (like tokens) in JavaScript reachable locations, this style is not encouraged for applications dealing with sensitive data. As the “OAuth 2.0 for Browser-Based Apps” IETF/OAuth working group BCP document says

there is no browser API that allows to store tokens in a completely secure way.

Additionally, modern browsers have recently added or are planning to add privacy features that can break some front-channel protocol interactions. See here for more details.