Since I wrote the post Azure Active Directory Authentication for React I discovered that the library used (react-aad-msal) is being depreciated as Microsoft are now providing their own offical library (@azure/msal-react) for these purposes.
There’s good documentation of the msal-react library available on the package page as well as samples and documentation on the GitHub page. There’s also reasonable documentation on how to enable OAuth2 authentication for Azure Functions here.
This all worked pretty much as expected but the main issue I faced was in retrieving access tokens in order to call OAuth2 protected Azure Functions from my React app. The first problem was that it seems that although the acquireTokenSilent method accepts an array of scopes, only the first scope is used in the token request so you can only obtain a token valid for one scope at a time.
The next issue was that even when I’d got a token for the correct scope my function was still returning 401 responses. It turns out that I was retrieving v1 tokens from the app registraition and that the Azure Function was expecting a v2 token. In order to generate a v2 token the accessTokenAcceptedVersion property in the app registraition needs updating from null to 2.
0 Comments