有谁知道如何使用 Azure Active Directory 和 React SPA 设置 OpenIdConnect Auth 而不在浏览器中存储访问令牌

Question

I am trying to build an app where users can sign in using their work Microsoft account through open id connect. All of the documentation on Microsoft seems to suggest that for React/SPA apps you should use the MSAL library to authenticate users but this seems to cache the access tokens directly in the brower through session storage. To my knowledge this is bad practise and a backend for frontend approach should be used for this scenario instead where the access token is stored in a HTTP secure cookie.

Does anyone know how to do a backend for frontend type approach using Azure Active Directory? Is there support for this using Microsoft Api's or do I have to just write the code from scratch?

Thanks for any help

Answer 1

You need to use a server side solution to issue application level secure cookies. It is not specific to Azure AD.

The Duende BFF solution is .NET based, and uses the web host, eg https://www.example.com , to issue cookies. See this code example and the docs.

It is also possible to issue cookies via a utility API that runs in a sibling domain of the SPA, eg https://api.example.com . This is a little more complex, but provides options such as deploying the SPA to a content delivery network - see this code example .