首页 > 解决方案 > 如何将 OAuthCard 的“登录”按钮的行为更改为仅打开 URL 而无需重定向

问题描述

我将 Webchat(来自 Microsoft Bot Framework)嵌入到另一个使用引擎盖下的浏览器的应用程序中。

在尝试向机器人添加身份验证时,我意识到 OAuthCard 的登录按钮不起作用,因为它试图打开一个空白窗口(关于:空白),该窗口用于将用户重定向到身份提供者的登录页面. 在嵌入式上下文中,操作系统不知道如何处理 about:blank 调用。见下图。

我正在关注这个示例,它实际上是在浏览器上运行的:
Add authentication to a bot
Bot authentication example

我想知道是否有办法改变 OAuthCard 的“登录”按钮的行为,直接打开登录 URI,而不使用 about:blank 和重定向技术。

标签: oauthbotframeworkweb-chat

解决方案


在发现可以在 Webchat 进行渲染之前将 OAuthCard 的按钮类型从“signin”更改为“openUrl”后,我能够使其工作。

Microsoft Teams 似乎也存在类似的问题。在这里我找到了线索:
https ://github.com/microsoft/botframework-sdk/issues/4768

根据 Webchat 参考,可以交叉和更改活动:
https ://github.com/microsoft/BotFramework-WebChat/blob/master/docs/API.md#web-chat-api-reference

这是解决方案,这更像是一个黑客。我希望将来可以配置:

      // Change the button type in the OAuthCard to the type of OpenUrl
      const store = window.WebChat.createStore( {}, ( { dispatch } ) => next => action => {
        if (action.type == "DIRECT_LINE/QUEUE_INCOMING_ACTIVITY" && 
            action.payload.activity.hasOwnProperty("attachments") && 
            action.payload.activity.attachments[0].contentType === "application/vnd.microsoft.card.oauth") {
          action.payload.activity.attachments[0].content.buttons[0].type = "openUrl";
        }
        return next( action );
      });
      
      // Pass the store to the webchat
      window.WebChat.renderWebChat({
         ...,
         store
      });

推荐阅读