如何为Microsoft Team App的Microsoft Application Portal配置重定向URI

Question

我已经创建了SharePoint Webpart并将其启动到Microsoft Teams。

Webpart需要向Microsoft Graph发送请求以进行身份​​验证。在开发期间，我在apps.dev.microsoft.com中添加了指向我的本地计算机（https://localhost:4321/temp/workbench.html）的重定向URL。身份验证正常。

当Webpart位于Teams中时，URL是特定于通道/选项卡的，我似乎无法复制URL以完成身份验证。

我已经尝试了URL的组合，希望它们足以满足身份验证要求。在这里，您可以看到运行正常的开发网址。

这里是带有URL的Webpart，但是我找不到对每个Id含义的引用，以重现链接。 Microsoft应用程序注册也不允许复制和粘贴此链接，因为它包含查询。

https://teams.microsoft.com/_#/tab::d7cdb44e-ed6e-4dwb-82db-b933adc8152d/General?threadId=15:512c0d9b1af125d68b5d310de6f76f@thread.skype&ctx=channel

手动单击此链接会将我带到位于团队中的Web部件，但是它具有无法在应用程序注册门户中使用的查询字符串。我也尝试缩小网址并粘贴缩短的链接-但无济于事。

如果任何人都可以指出正确的方向，以在正确的上下文中重新创建我上面发布的链接，或者知道它不起作用的原因，请告诉我。谢谢。 （用于演示目的的链接）。

预期结果-登录窗口关闭，用户通过身份验证。

实际结果-由于重定向链接不匹配，因此验证相关性失败。

我的Webpart有一个按钮-其第一个功能是使用以下代码对用户进行身份验证：

 public async login(){
  var that = this;
   await me.userAgentApplication.loginPopup(config.scopes).then(async function (idToken) {
    await me.userAgentApplication.acquireTokenPopup(config.scopes).then(async function (accessToken) {
       that.getWebUrl(accessToken);
      }, function (error) {
          console.log(error);
      });
    });
}

因此它使用Microsoft-graph进行身份验证。我也将托管站点添加到Redirect-Urls列表中。从共享点站点可以很好地进行身份验证-但是如何将访问令牌发送给团队。

Answer 1

重定向URI应该指向您的网站，而不是客户端应用程序。换句话说，您应该将它们重定向到您正在托管的页面 。调用该页面后，您将处理身份验证（将授权代码转换为访问令牌，存储刷新令牌，验证state属性等），然后将其重定向到最终目的地。

如果您需要将最终目的地传递到您的页面（即保留指向频道的链接），则应对其进行编码，然后使用state参数将其传递。该state将保持不变，返回到重定向页面。然后，您的应用可以对其进行解码以确定最终目的地。