There was a problem reaching this app | Static Tabs Application fails to initialize.
I'm developing simple Tab application for my search engine, my idea is to just add an iframe in hello.html and set the source to my URL.
here is my markup - hello.html:
<html>
<head>
<script src="..../teams-js/2.22.0/..." ></script>
<script src=".../teamsapp.js?v=1.0.1"></script>
<title>My App</title></head>
<body>
<iframe src="https://chat.web.com">
<script>
microsoftTeams.appInitialization.notifySuccess();
</script>
</body>
</html>
here is my teamsapp.js (function () {
"use strict";
// Call the initialize API first
microsoftTeams.app.initialize().then(function () {
});
})();
and here is my manifest.json
{
"$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.19/MicrosoftTeams.schema.json",
"manifestVersion": "1.19",
"version": "1.0.1",
"id": "abcb1633-6493-47e9-8472-12328939dfff",
"developer":
{
"name": "Ahmad Ahsan",
"websiteUrl": "https://www.web.com/",
"privacyUrl": "https://www.web.com/team-app-privacy-policy",
"termsOfUseUrl": "https://www.web.com/team-app-terms-and-conditions"
},
"icons": { "color": "color.png", "outline": "outline.png" },
"name": { "short": "TeamApp", "full": "Team App full Nmae" },
"description": { "short": "Teams App Short Description", "full": "Teams App Full Description." },
"accentColor": "#FFFFFF",
"staticTabs": [
{
"entityId": "index0",
"name": "Home",
"contentUrl": "https://chat.web.com/",
"websiteUrl": "https://chat.web.com/",
"scopes": [ "personal" ]
}
],
"permissions": [ "identity", "messageTeamMembers" ],
"validDomains": [ "chat.web.com" ]
}
The issue is:
It is mentioned in official documentation (https://learn.microsoft.com/en-us/microsoftteams/platform/resources/schema/manifest-schema#statictabs) that contentUrl and websiteUrl are not required in staticTabs object, but if I remove contentUrl my application fails to install in debug mode.
If I set it to "contentUrl": "https://chat.web.com/" then application is installed, it opens fine but after some moments it show alert / warning / error message "There was a problem reaching this app" and in console it shows failed reason: AppInitTimeout [Screenshot Attached]
However if I set it to "contentUrl": "${{TAB_ENDPOINT}}" and is .env.local it is set to TAB_ENDPOINT=https://localhost:53000 then it works fine, but I don't know how it'll behave when I set the value to **TAB_ENDPOINT=https://chat.web.com **in .env.dev file and
why it is not working when:
I set the value without using variable?
I remove the contentUrl from staticTabs object?
P.S: My website have no other page / path / url. Domain name is only valid URL.