1

I am trying to use identity platform to authenticate users into my custom app that is to be used from within MS Teams.

I am aware that Teams uses iFrame to load the custom apps. So I followed the method mentioned in the FAQs - Q5. I used redirectUri property in the MSALConfig. I am using the index file provided by MS for testing purposes by calling it inside an iFrame tag.

In both cases of acquireTokenSilent and acquireTokenPopup, it gets stuck at the popup window loading the redirect page. Neither the authentication is getting completed nor the popup window getting closed.

2 Answers2

0

The following steps can unblock the Teams Tab scenario for the desktop/mobile apps.

Manual Steps

Step 1. Assure you have approved requests in 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/RegisteredAppsPreview

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

"preAuthorizedApplications": [
    {
        "appId": "00000003-0000-0ff1-ce00-000000000000",
        "permissionIds": [
            "ID OF THE USER_IMPERSONATION Scope"
        ]
    }
],

Step 7. Hit Save.

C. Pritch
  • 1
  • 3
  • Thanks @C. Pritch, but I still do not get any tokenResponse from the acquireTokenSilent() method. – Nischai Vinesh Aug 23 '19 at 07:52
  • Hi @NischaiVinesh is there any chance you could update your answer with a minimal version of the code you use to authenticate with the resource? Also what AD secured resource are you trying to access? Is it Graph/SharePoint data? – C. Pritch Aug 23 '19 at 15:42
  • Hi @C. Pritch, I am using the same code mentioned in this [Demo](https://mybuild.techcommunity.microsoft.com/sessions/77028?source=TechCommunity). I downloaded the index file from the 'App page' in Azure App registrations and followed the demo to test it within MS Teams. I am trying to access the Graph as I am using the same code in the sample. Once this is ready, I will be changing it to redirect it to my custom page, which mainly uses the access token to authenticate the user to access various other data from our site. – Nischai Vinesh Aug 26 '19 at 07:15
  • I am not able to paste the relevant codes in here as reply, but its mostly the same code available in the azure. – Nischai Vinesh Aug 26 '19 at 09:19
  • Judging from responses to: https://stackoverflow.com/questions/57657261/new-sso-for-custom-tab-in-microsoft-teams. It simply does will not work and we need to be patient :( – Koen Vissers Aug 30 '19 at 14:48
  • @KoenVissers this is not correct. We have SSO to Graph working in a custom SPFx component in a Teams tab. The steps I followed were correct in pre-authorising the app. You should not need MSAL/ADAL and you should use the pnpjs library for authentication. It'll save plenty of time. If you let me know if you're ok with TypeScript and what resource you're accessing and I'll post some boilerplate code. – C. Pritch Sep 02 '19 at 15:53
  • @C.Pritch If I understood correctly, the authentication of Teams app was done in the configuration page. Kindly correct me if I am wrong. We are trying to fetch the access token of the current user logged in to Teams to provide access to the custom app deployed in Teams tab. We can give a shot with TypeScript ofcourse. But I was going through the samples of pnpjs and it seems to me that they in-turn uses MSAL/ADAL library for authentication purposes. Again, kindly correct me if I am wrong. – Nischai Vinesh Sep 03 '19 at 14:07
  • It will really helpful if you can point us to the right direction. – Nischai Vinesh Sep 03 '19 at 14:13
  • @NischaiVinesh- Currently in Microsoft Teams, only [silent authentication](https://learn.microsoft.com/en-us/microsoftteams/platform/concepts/authentication/auth-silent-aad) in Azure Active Directory is supported which is a simplified form of single sign-on (SSO). User needs to sign in at least once for it to work. We are working SSO support. – Wajeed Shaikh Sep 03 '19 at 15:36
  • @Wajeed-MSFT Silent auth is a form of SSO. There is a known issue with silent authentication in the Teams tab. My posted answer resolves this issue by granting access to the Client Extensibility app. – C. Pritch Sep 03 '19 at 16:13
  • @NischaiVinesh I'll be happy to provide some example working code and some guidance. I'll give you vanilla JS if you're not using TS yet. It's a case of building a webpart with the requests, installing it into their SharePoint apps. Approving the permissions request, doing my step in my original answer and then it should all work. I would say that moving to TS has saved our department many hours in development time. – C. Pritch Sep 03 '19 at 16:16
  • @Wajeed-MSFT We already tried with the silent authentication using ADAL library. It works fine, except that the user has to login to the custom app frequently even though he is logged in to Teams. We were looking for a smoother way to implement the authentication part, using MSAL and identity platform. – Nischai Vinesh Sep 04 '19 at 08:01
  • @C.Pritch Sure, that would be great. Do you want to post it here or you can mail me at b4nischai@gmail.com – Nischai Vinesh Sep 04 '19 at 09:10
  • @NischaiVinesh I'll update my answer with some example code once I get back from work tonight. Should be around 20:00GMT. – C. Pritch Sep 04 '19 at 09:44
  • @C.Pritch Sure, that would be great. – Nischai Vinesh Sep 04 '19 at 13:35
  • @Wajeed-MSFT "We are working SSO support.". Where can we best follow / check developments in this area? – Koen Vissers Sep 11 '19 at 13:24
  • New features are listed here: https://learn.microsoft.com/en-us/microsoftteams/platform/whats-new – Wajeed Shaikh Sep 13 '19 at 13:01
  • @C.Pritch It will be great if we could use your work-around to get this working. Eagerly waiting for your solution. – Nischai Vinesh Sep 16 '19 at 11:29
  • Thanks @Wajeed-MSFT, I could fix this issue with the new feature, SSO. – Nischai Vinesh Jan 02 '20 at 08:54
0

This issue was solved by changing the implementation to use new feature - SSO instead of MSAL library.