SPFx webpart in MSTeams Desktop Client throws an UnauthorizedAccessException - sharepoint

Question

This question is very similar to a question which has been asked previously on StackOverflow. However, the error I'm getting is different.
AadHttpClient fails when loading SP page with SPFx webpart in MSTeams Desktop Client
I also have a Sharepoint Online site in which I have an SPFx web part which makes use of AadHttpClient.
This webpart works if I navigate to the Sharepoint site from a browser or open MS Teams web client.
A glimpse of my setup:
Here is a "steps to repro" overview of the issue I am facing.
Deploy the web part to SharePoint
View the web part in SharePoint – web part displays and loads OK
Add a SharePoint Tab in Teams and bind it to the page with the web part
View the tab in Teams Desktop client – data fails to load in web part (refer below)
View the tab in Teams Web client – web part displays and loads OK
When I debugged the MS Teams desktop client, I have this call in in the Network requests tab:
https://{mytenant}.sharepoint.com/sites/{mysite}/_api/Microsoft.SharePoint.Internal.ClientSideComponent.Token.AcquireOBOToken?resource={GUID of my AAD app registration}&clientId={GUID of SharePoint Online Client Extensibility AAD app registration}
With the response:
Error 403:
{"odata.error":{"code":"-2147024891,
System.UnauthorizedAccessException","message":{"lang":"en-US","value":"Access
denied. You do not have permission to perform this action or access
this resource."}}}
One interesting observation was that this web request only happens in Microsoft Teams desktop client.
I am interested in knowing why this only happens in MS Teams desktop client and not on either the MS Teams web client or Sharepoint Online.
Update: 10/02/2020
Another observation: We tried the same setup on a different tenant (personal tenant instead of our corporate tenant). We noticed that the same behaviour could be reproduced when MFA is turned-on on the Azure Active Directory.
The request that's failing is:
https://{personal tenant}.sharepoint.com/sites/{site name}/_api/Microsoft.SharePoint.Internal.ClientSideComponent.Token.AcquireOBOToken?resource={GUID of the AD app registration}&clientId={GUID of the SPO Client Extensibility app registration}
However, now the error returned is a 500 with the response:
{"odata.error":{"code":"-1,
System.AggregateException","message":{"lang":"en-US","value":"One or
more errors occurred."}}}
Similar issue found, (but a different error) out on Github: https://github.com/SharePoint/sp-dev-docs/issues/4915

Answer 1

I faced similar issue recently for a webpart that was calling graphAPI. On Desktop teams the call never use to happen and it use to get stuck. I was able to fix it by following these steps: -
Step 1. Visit the new API Permission Management Page on the Tenant Admin Site. This creates a client secret behind the scenes.
Step 2. Go to -> https://aad.portal.azure.com/#blade/Microsoft_AAD_IAM/ActiveDirectoryMenuBlade/RegisteredApps
Step 3. Click on SharePoint Online Client Extensibility Web Application Principal
Step 4. Click Manifest on the left menu Step 5. Copy the id from the oAuth2Permission array
"oauth2Permissions": [
{
"adminConsentDescription": "Allow the application to access SharePoint Online Client Extensibility Web Application Principal on behalf of the signed-in user.",
"adminConsentDisplayName": "Access SharePoint Online Client Extensibility Web Application Principal",
"id": "2143704b-186b-4210-b555-d03aa61823cf",
"isEnabled": true,
"lang": null,
"origin": "Application",
"type": "User",
"userConsentDescription": "Allow the application to access SharePoint Online Client Extensibility Web Application Principal on your behalf.",
"userConsentDisplayName": "Access SharePoint Online Client Extensibility Web Application Principal",
"value": "user_impersonation"
}
],
Step 6. Replace “preAuthorizedApplications” entry with the following json. Keep the appId as it is written below.
"preAuthorizedApplications": [
{
"appId": "00000003-0000-0ff1-ce00-000000000000",
"permissionIds": [
"YOUR COPIED ID FROM STEP 5"
]
}
],
Step 7. Hit Save.
Let me know if this works for you. I referred the above steps from https://github.com/SharePoint/sp-dev-docs/issues/3923#issuecomment-514726341

Answer 2

Finally I have a solution that:
Delete the app SharePoint Online Client Extensibility Web Application Principal and SharePoint Online Client Extensibility Web Application Principal Helper
Wait few mins let the AAD create them again.
After that request permission from custom app.
Go to API access page to grand again the permission will automatically sync to "SharePoint Online Client Extensibility Web Application Principal".
Test again the app. Also deactivate the Limited-access user permission lockdown mode could be help.
Now all my app work as expected.
Why?
Limited-access user permission lockdown mode could block your permission to request api.
Delete App in AAD to get the the token and all the configuration sync again.
The way to grand permission from API Access it correct not grant from AAD App.