SSO on Teams Tab web application doesn't work in Teams Application

Niek Hodes 1 Reputation point
2021-03-04T14:51:27.603+00:00

Situation:
We are trying to configure a Teams Tab that shows a website.
We used App Studio to configure our app. We followed this guide to do so:
https://dev.to/vishesh/how-to-create-a-microsoft-teams-tab-app-2jon It works perfectly in a browser, however when opening the app in de Teams app in Windows SSO doesn't seem to be working.

We also tried configuring an App registration to configure SSO using the Microsoft Teams Toolkit, and then used the App Studio from there where it did additionally fill in the Single-Sign-On url like this:
api://{tenant}.onmicrosoft.com/{appID}.
Even after configuring this, SSO did still work in the browser, however when using a tab it still was not functional, and we just got a white screen.

We also tried changing the content URL to the saml login page, however that did not change anything: It still worked perfectly via the browser, but not in the app.

When looking at the way to configure this for Sharepoint embedded apps as in this manual: https://learn.microsoft.com/en-us/sharepoint/dev/features/embed-pages-to-teams It seems the content URL adds: SPFX=true&dest={PATH}

We did find a workaround to get SSO working for the app, following the example of this guide: https://tomtalks.blog/2019/11/adding-outlook-email-and-calendar-app-to-microsoft-teams-a-proof-of-concept/.
However this would require extra steps for the users:
When opening the same website in a a tab in a Teams channel first, SSO works perfectly there.
74300-website.png
Then after it worked in that tab in the channel, we can open the app as a personal tab, and then SSO works perfectly there as well (probably because it uses the same token as it did in the channel).

Question:
How can we get SSO to work for our web application in the Teams application?

Current manifest of our app:

{
"$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.8/MicrosoftTeams.schema.json",
"manifestVersion": "1.8",
"version": "1.0.0",
"id": "{SECRET",
"packageName": "com.microsoft.teams.extension",
"developer": {
"name": "Teams App, Inc.",
"websiteUrl": "https://teamstogo.onmicrosoft.com",
"privacyUrl": "https://teamstogo.onmicrosoft.com/privacy",
"termsOfUseUrl": "https://teamstogo.onmicrosoft.com/termsofuse"
},
"icons": {
"color": "color.png",
"outline": "outline.png"
},
"name": {
"short": "KB Owl",
"full": "Knowledge Owl"
},
"description": {
"short": "Short description for Test.",
"full": "Full description of Test."
},
"accentColor": "#FFFFFF",
"staticTabs": [
{
"entityId": "index",
"name": "Personal Tab",
"contentUrl": "https://ogd-test.knowledgeowl.com/help/saml-login",
"websiteUrl": "https://ogd-test.knowledgeowl.com",
"scopes": [
"personal"
]
},
{
"entityId": "about",
"scopes": [
"personal"
]
}
],
"permissions": [
"identity",
"messageTeamMembers"
],
"validDomains": [
"ogd-test.knowledgeowl.com",
"teamstogo.onmicrosoft.com"
],
"webApplicationInfo": {
"id": "{SECRET",
"resource": "api://teamstogo.onmicrosoft.com/{SECRET}"
}
}

Microsoft Teams Development
Microsoft Teams Development
Microsoft Teams: A Microsoft customizable chat-based workspace.Development: The process of researching, productizing, and refining new or existing technologies.
3,059 questions
{count} votes

1 answer

Sort by: Most helpful
  1. Mallipriya-MSFT 91 Reputation points
    2021-03-05T09:39:59.847+00:00

    Hi anonymous user-0936,
    Could you please have a look at the SSO for Tabs In Teams document and try this code sample and also please debug and check the console logs for errors in desktop app by following the document - DevTools for Microsoft Teams tabs - Teams | Microsoft Learn.

    1 person found this answer helpful.