Difference between teams app tab and website tab inside team channel

[cmbalderrama]

When I try to create an app in app studio and put a webpage URL in a personal tab, It won't load, doesn't show anything (I read that is because most of the pages won't allow to be embed in an iframe) . But when I create a new tab inside a teams channel and I use the "website" app it does load the sames pages, so how are they embedding the pages inside that tab and how is it different from the personal tab in a new app. 

Is there a way to show a website in a new app that doesn't use iframe or that works like in the teams channel tab?

Thanks

[#2]

Hi @cmbalderrama - Could you please explain which website are you trying to embed in a tab and also share the code snippets of tab. 

[#3]

Hi,

well I'm trying to embed some internal pages, but I have tried with any pages, even google, when I put the URL in the personal tab when creating an app in app studio in won't show anything, but when I put the same URL in the teams channel tab with the website app it shows the page and work.

this is with the personal tab in app studio:

doesn't load anything but the link to go to website does work (so no problem with the url)

 and this in the teams channel tab:

[#4]

@cmbalderrama 

For a Teams app you would need to also list all the possible domains that would be accessed in the valid url section. For SharePoint pages I use the following

    "validDomains": [

        "<yourdomain>.sharepoint.com",

        "msft.spoppe.com",

        "resourceseng.blob.core.windows.net",

        "spoppe-a.akamaihd.net",

        "spoprod-a.akamaihd.net",

        "*.sharepoint-df.com",

        "*.sharepoint.com",

        "*.login.microsoftonline.com"

    ],

[#5]

@StevenC365 
Hi,
Yes I also have that but still doesn't work. I think valid domains are automatically added by app studio when a url is entered in the personal tab section:

"validDomains": [

"weather.com",

"www.google.com.mx"

]

}

Am I missing something else?
Thanks

[#6]

Hi @cmbalderrama, You can add websites in teams channel as a tab using "website" app without authentication in teams. But when you add website in a personal tab you need to add authentication for that website. Please go through this documentation to add authentication. 

[#7]

Hi, umn I don't understand, I need to add authentication even if it is a public website like google? and I'm only using personal tabs not bots.
Is there a way to do this trough the app studio? because why would they allow to create a personal tab there indicating the url if it can't be displayed.

Thanks

[#8]

Hi @cmbalderrama - Tabs in teams display a web content  which are IFramable. But Google will send an "X-Frame-Options: SAMEORIGIN" response header.

To open Google as a tab in teams use content url as shown below.

https://www.google.com/webhp?igu=1

Let me know if the issue resolved. 

[#9]

Hi, Thank you but that didn't worked, I put that url and still won't load.
{
"entityId": "GoogleTab",
"name": "Google",
"contentUrl": "https://www.google.com/webhp?igu=1",
"websiteUrl": "https://www.google.com/webhp?igu=1",
"scopes": [
"personal"
]
},

That is way my original question was what is the diference between the tabs inside teams channel and personal tabs in an app.
If in the personal tab in the app the websites are display in an Iframe and they don't load because they are not Iframable, why they do load inside the teams channel tab, aren't they using and Iframe?

Thanks

[#10]

Hi @cmbalderrama - The "website" app in a tab channel is a third party app which allows to add websites as a tab to a channel. Where as personal tab is a custom app which allows only Iframable webpages to as a tab.  

[#11]

@cmbalderrama  - I am able to get the google as a personal tab as shown below. 

[#12]

Hi, is there anything else that you added or changed in the app studio? Because I put the same URL but for me it doesn't load

Thanks

[#13]

Hi @cmbalderrama - Could you please share the console log messages for tab. 

[#14]

Hi @Mamatha-MSFT 
This is what I get:

But it's ok, because I also need to add another pages (that are not google) as tabs and if there is no way to put a website without an iframe as a personal tab it's not going to work for me.

I though there might be another way, (the way they do it on the website app inside tab team channel, because the same pages does work there) . Maybe that should be a new requirement for Teams.

But thanks anyway 

[#15]

@cmbalderrama Have you gotten this to work?  I am trying to add a few webpages and they all keep failing.  I have been trying the public pages route and internal pages.  Nothing will load. Do you have a solution?