"Token request previously failed" for any attempt to get a token using AadHttpClient

[andrewpeterson99]

Target SharePoint environment

SharePoint Online

What SharePoint development model, framework, SDK or API is this about?

💥 SharePoint Framework

Developer environment

Linux

What browser(s) / client(s) have you tested

• 💥 Internet Explorer
• 💥 Microsoft Edge
• 💥 Google Chrome
• 💥 FireFox
• 💥 Safari
• mobile (iOS/iPadOS)
• mobile (Android)
• not applicable
• other (enter in the "Additional environment details" area below)

Additional environment details

• @microsoft/sp-http version 1.18.2

Describe the bug / error

Some clients I'm working with have issues loading my Sharepoint integration on their site. For those clients who are experiencing the issue (which is not all of them), they get the following error:

Error: Token request previously failed
    at new t (isolated-web-part-application-assembly_en-us_0163bd78c832d245659e31eafdd0fd47.js:103:184)
    at e._getTokenDataInternal (isolated-web-part-application-assembly_en-us_0163bd78c832d245659e31eafdd0fd47.js:103:2580)
    at e._getTokenInternal (isolated-web-part-application-assembly_en-us_0163bd78c832d245659e31eafdd0fd47.js:103:1480)
    at e.getToken (isolated-web-part-application-assembly_en-us_0163bd78c832d245659e31eafdd0fd47.js:103:1077)
    at e.getToken (isolated-web-part-application-assembly_en-us_0163bd78c832d245659e31eafdd0fd47.js:103:11037)
    at n._fetch (isolated-web-part-application-assembly_en-us_0163bd78c832d245659e31eafdd0fd47.js:118:7290)
    at n.fetch (isolated-web-part-application-assembly_en-us_0163bd78c832d245659e31eafdd0fd47.js:118:5748)
    at n.get (isolated-web-part-application-assembly_en-us_0163bd78c832d245659e31eafdd0fd47.js:118:6126)
    ...

This error is caused by the following lines in my application:

const tokenProvider = await this.context.aadTokenProviderFactory.getTokenProvider();
return await tokenProvider.getToken(Config.azureAppUrl);

I've managed to repro this on a local test account, and no matter how many reinstalls I do of my Sharepoint app, the error still occurs. I have other accounts where the app works fine and token requests go through. I tried following the steps here, but they did not resolve the issue. I am happy to provide any more details that are required. This is quite a big issue for my application since I rely on the JWT provided by MS as part of the auth process in my application's backend.
Thank you for any help you can provide.

Steps to reproduce

This does not occur on every install of my application, and so I'm not sure exactly what's triggering it. However, this is what I have setup right now to repro it:

1. Install my Sharepoint integration that makes a call to get a JWT in the callstack as part of the render() entrypoint for the webpart.
2. Observe that the error discussed above appears.

Expected behavior

A token is returned as part of the call w/out an error as mentioned above (copied here):
This error is caused by the following lines in my application:

const tokenProvider = await this.context.aadTokenProviderFactory.getTokenProvider();
return await tokenProvider.getToken(Config.azureAppUrl);

[andrewpeterson99]

Testing this in an incognito window/with cookies cleared does not resolve this issue either.

[andrewpeterson99]

By using a local override of my app in prod, I can see that the initial token request fails with:
BrowserAuthError: monitor_window_timeout: Token acquisition in iframe failed due to timeout.
However, it's not clear why since the same app works for me on the same connection on a different tenant.

[kbeeveer46]

@andrewpeterson99 I may have jinxed myself. In my previous posts I mentioned that we only get the token errors sporadically but it just happened to everyone in our company and took down all of our SharePoint sites for 6 hours. I created an issue thinking it might have been widespread. #9828

After this, I think I'm going to remove the token generation code and replace it with my own version of tokens. I think we're only using the token to validate that someone making an API call is authenticated inside SharePoint. If that's the only reason, I think I can generate my own "token" after the user logs in, save it to the database and a cookie on their computer, and send the token with every API call. Before the API call retrieves data from the database I'll validate the token that was sent in the API call with one that is stored in the database for that user. It seems like it would work in my head but I'm not a security expert.

[Ashlesha-MSFT]

Hello @andrewpeterson99,
Thank you for bringing this issue to our attention. We will look into it and get back to you shortly.

[Ashlesha-MSFT]

@andrewpeterson99,
I wanted to confirm that I was able to get the expected output using the following code:

const tokenProvider = await this.context.aadTokenProviderFactory.getTokenProvider();
const token = await tokenProvider.getToken("https://graph.microsoft.com");
return token;

This successfully returns a raw access token for Microsoft Graph, and I can see it logged in the console. Based on my understanding, this token can now be used to authenticate requests to the Graph API.

Please let me know if my understanding is correct or if there's anything else I should consider (e.g., token caching, renewals, or best practices for using it in subsequent API calls).

Thanks!

[Ashlesha-MSFT]

@andrewpeterson99,
Just following up on my earlier message to see if you had a chance to review the code snippet and my understanding of how the token can be used for Microsoft Graph API calls.

Would appreciate your feedback—especially if there's anything I might be overlooking regarding token caching, renewals, or general best practices.

[andrewpeterson99]

It's been so long since I was working on this SharePoint app that I can't remember all the context behind this issue :(