I was recently developing a Microsoft Teams application and ran into some issues during implementation where the requirement was to configure a teams app that contained, a Power Apps application and a modern SharePoint page as two separate tabs in the same app.
At the face of it, this seemed like a very easy to implement app and could be achieved by modifying the manifest and include two static tabs, only to realize that this didn’t seem so simple as I thought it was.
The challenge was authentication.
We know that a SharePoint page can be added as a Teams tab by modifying the manifest and adding the following to the manifest to achieve SSO
Content URL – https://[domainUrl]/_layouts/15/teamslogon.aspx?SPFX=true&dest=[pageUrl]
Valid Domains – sample.onmicrosoft.com
Web Application Info object with two attributes – id : 00000003-0000-0ff1-ce00-000000000000 and resource: [domainUrl]
The complete manifest would look like this
{
"$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.6/MicrosoftTeams.schema.json",
"manifestVersion": "1.6",
"version": "1.0.0",
"showLoadingIndicator": false,
"id": "7ad6f150-cba8-4c39-81ce-c4da8e4100d9",
"packageName": "com.mytenant.portal.app",
"developer": {
"name": "Test App",
"websiteUrl": "https://www.mytenant.com",
"privacyUrl": "https://www.mytenant.com/privacy",
"termsOfUseUrl": "https://www.mytenant.com/temsofuse"
},
"icons": {
"color": "color.png",
"outline": "outline.png"
},
"name": {
"short": "Portal App",
"full": "Our modern portal"
},
"description": {
"short": "My first portal application",
"full": "My awesome portal application to embed modern SharePoint to our Teams setup"
},
"accentColor": "#FFFFFF",
"staticTabs": [
{
"entityId": "19991",
"name": "Portal",
"contentUrl": "https://mytenant.sharepoint.com/_layouts/15/teamslogon.aspx?SPFX=true&dest=/sites/theperspective/SitePages/Home.aspx",
"scopes": [
"personal"
]
}
],
"permissions": [
"identity",
"messageTeamMembers"
],
"validDomains": [
"mytenant.sharepoint.com"
],
"webApplicationInfo": {
"id": "00000003-0000-0ff1-ce00-000000000000",
"resource": "https://mytenant.sharepoint.com"
}
} If we wanted to add a Power Apps application as another tab in the same app, we would have to modify the manifest to include another static tab and include the following json to the existing manifest
{
"entityId": "c93d8c62-65b4-45b1-ad40-9bad889d315d",
"name": "Move Mail",
"contentUrl": "https://apps.powerapps.com/play/c93d8c62-65b4-45b1-ad40-9bad889d315d?tenantId=aabad8dd-1b74-4873-8416-847c79c39b62&source=teamstab&locale={locale}&channelId={channelId}&channelType={channelType}&chatId={chatId}&groupId={groupId}&hostClientType={hostClientType}&isFullScreen={isFullScreen}&subEntityId={subEntityId}&teamId={teamId}&teamType={teamType}&theme={theme}&userTeamRole={userTeamRole}",
"websiteUrl": "https://apps.powerapps.com/play/c93d8c62-65b4-45b1-ad40-9bad889d315d?tenantId=aabad8dd-1b74-4873-8416-847c79c39b62",
"scopes": ["personal"]
}
"validDomains": [ "mytenant.sharepoint.com","*.powerapps.com"]
"webApplicationInfo":{
"id": "9362bc14-3e81-4ef9-8b77-f1c40afe68e0",
"resource": "https://apps.powerapps.com"
} Wait, how am I supposed to add another entry to the webApplicationInfo object as I already have one? The webApplicationInfo object isn’t an array, so how is anyone supposed to achieve seamless authentication across a Power Apps app and a SharePoint page in one Teams app.
I reached a dead end here.
The only workaround I had was to add the Power Apps app to a SharePoint page using the Power Apps WebPart and then surface the SharePoint page as a static tab in the Teams App using the method above.
Do you know of any other way that this issue can be resolved? If yes, please mention it in the comments section of this post. I will be happy to learn!
i have tried so many combinations and i succussed for SharePoint page and Power apps but the SP page has Spfx web part we access the page but without webpart.
For power apps add
Content URL – “https://web.powerapps.com/webplayer/iframeapp?source=teamstab&appId=/providers/Microsoft.PowerApps/apps/your_Power_App_ID”
Valid Domains – “apps.powerapps.com”,
“web.powerapps.com”,
“*.login.microsoftonline.com”,
“microsoft.sharepoint.com”,
“microsoft.sharepoint-df.com”,
“spoppe-a.akamaihd.net”,
“spoprod-a.akamaihd.net”,
“resourceseng.blob.core.windows.net”,
“msft.spoppe.com”
“webApplicationInfo”: {
“id”: “475226c6-020e-4fb2-8a90-7a972cbfc1d4”,
“resource”: “https://service.powerapps.com/”
}