如何在 MS Teams 的组/聊天选项卡中添加我的自定义应用程序？

Question

我按照 MS Teams 官方文档中列出的步骤 - https://docs.microsoft.com/en-us/microsoftteams/platform/tabs/how-to/add-tab

我正在尝试将我的 CakePHP Web 应用程序添加到团队/群聊中。我还尝试创建配置页面以在 MS Teams 和我的 Web 应用程序之间进行通信，但没有成功。

我为我的网络应用程序使用了 CakePHP 框架，因此使用它的默认布局来创建配置页面。下面是我在默认布局页面中添加的代码。

<script src="https://statics.teams.cdn.office.net/sdk/v1.8.0/js/MicrosoftTeams.min.js"></script>

<script>
    microsoftTeams.initialize();

    microsoftTeams.settings.registerOnSaveHandler((saveEvent) => {
        microsoftTeams.settings.setSettings({
            websiteUrl: "My website URL",
            contentUrl: "My content URL(which is same as my website URL)",
            entityId: "unique entity id that is mentioned in the app manifest file",
            suggestedDisplayName: "My tab name"
            });
        saveEvent.notifySuccess();
    });

    microsoftTeams.settings.setValidityState(true); 
</script>

我也没有收到任何错误，但是在标签中添加我的网络应用程序后，保存按钮被禁用，因此我无法保存标签。

参考这张图片：

Answer 1

您需要更仔细地阅读相关文档 - 配置页面需要在完成任何需要执行的配置工作时告知 Teams。例如，如果您在 Teams 中添加一个 SharePoint 选项卡，它使用户有机会从他们想要显示的 SharePoint 中选择 什么，因此此配置页面是必不可少的。如果您不需要为用户提供任何配置，您可以在页面上放置一条静态消息，但您仍需要通知 Teams 配置已“完成”，您可以通过调用 Teams JS 库，如下所示：

microsoftTeams.initialize();

microsoftTeams.getContext(function (context) {
    microsoftTeams.settings.registerOnSaveHandler((saveEvent) => {
        microsoftTeams.settings.setSettings({
            websiteUrl: "https://yourWebsite.com",
            contentUrl: "https://yourWebsite.com/yourtab",
            entityId: "myTab",
            suggestedDisplayName: "MyNewTab"
            });
        saveEvent.notifySuccess();
    });

    microsoftTeams.settings.setValidityState(true);
});

您可以阅读有关此here 的更多信息。