SPFx webpart in MSTeams Desktop Client throws an UnauthorizedAccessException

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

Could you please check the this.context.pageContext.web.absoluteUrl; what url you are getting? — Trinetra-MSFT
@Trinetra-MSFT Sure thing. I checked on both web and desktop clients. The value I got was: https://{TENANT}.sharepoint.com/sites/SA Happy to provide more details as needed — Sahan Serasinghe
if the url you are getting is same than it is definitely access issue. Could you check you have appropriate permission to access the sharepoint resource? When a webpart is hosted in sharepoint app catalog, there is option to sync with teams in sharepoint app catalog. I assume you have done that. It might also cause the unauthorized access. — Trinetra-MSFT
@Trinetra-MSFT Yes, I do have access to the Sharepoint resource. In fact, I deployed the web part myself. However, I do not see the Sync to Teams button in the Sharepoint app catalog. Is there a specific permission I should I ask from a tenant's global admin? Also, Do you know why the web part works on Teams' web client and not in desktop client? — Sahan Serasinghe
Sync with Teams will be available in sharepoint app catalog. If it is not may be you created the SPFx webpart project v1.7. Still few quick check did you added the sharepoint url in validDomain[] list of your manifest file? Here is the link for creating web part for teams tab and creating the manifest for webpart. — Trinetra-MSFT

Sanket Ghorpade Sanket Ghorpade · Accepted Answer · 2020-03-25T17:05:14

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

SPFx webpart in MSTeams Desktop Client throws an UnauthorizedAccessException

1 Answers