Bot Framework v4 加载 Facebook Webview

Question

我试图弄清楚如何让 MS Bot Framework v4 与 Facebook Web 视图一起工作。目前，整个互联网上没有任何关于如何使其工作的信息。有一些示例，like this one，展示了它如何与 BF v3 一起使用。

我不知道这是如何与 v4 中的 HeroCards 和 CardActions 一起工作的。

从文档看来，这种类型的功能需要一个 ActionTypes，其中包含一个 web_url 的值，该枚举完全省略了该值。 BF v4 不支持建议此功能。

我目前正在将一个 Botman PHP Bot 移植到 MS Bot 框架，在 Botman 中通过简单地在按钮元素上调用 enableExtensions() 来执行此操作似乎非常简单。

我尝试了太多的方法在这里列出，但当前的尝试看起来像这样：

var viewButton = new CardAction(
    "web_url", 
    "View Details", 
    null, 
    "",
    "",
    "https://myurl",
    JObject.FromObject(new { messenger_extensions = true }));

我已经完成了所有域白名单流程，所以我确信一切准备就绪，但是，我目前的尝试是 Messenger 只是错误，因为 Favebook 似乎不喜欢 Bot 框架生成的 JSON。

我也尝试过像这样子类化 CardAction 类：

public class WebViewCardAction : CardAction
{
    public WebViewCardAction(string displayText, string url)
    {
        Type = "web_url";
        Url = url;
        Title = displayText;
        MessengerExtensions = true;
        WebviewHeightRatio = "compact";
    }

    [JsonProperty(PropertyName = "url")]
    public string Url { get; set; }

    [JsonProperty(PropertyName = "webview_height_ratio")]
    public string WebviewHeightRatio { get; set; }

    [JsonProperty(PropertyName = "messenger_extensions")]
    public bool MessengerExtensions { get; set; }
}

在 Bot Framework 模拟器中查看 JSON 时会生成如下 JSON：

{
    "messenger_extensions": true,
    "title": "View Details",
    "type": "web_url",
    "url": "https://myurl",
    "webview_height_ratio": "compact"
}

这似乎与我在 FB messenger 示例中可以找到的内容一致。但是有了这个，FB Messenger 错误甚至没有显示HeroCard。

有人搞定了吗？

网上有例子可以看吗？

Answer 1

由于活动架构没有改变，您链接的示例也适用于 V4：

private async Task TestFacebookWebview(ITurnContext turnContext,
    CancellationToken cancellationToken)
{
    var reply = turnContext.Activity.CreateReply();

    var attachment = new
    {
        type = "template",
        payload = new
        {
            template_type = "button",
            text = "Your ? is on it's way!",
            buttons = new[]
            {
                new
                {
                    type = "web_url",
                    url = "https://mybot.azurewebsites.net/",
                    title = "See on map",
                    webview_height_ratio = "compact",
                    messenger_extensions = true,
                },
            },
        },
    };

    reply.ChannelData = JObject.FromObject(new { attachment });

    await turnContext.SendActivityAsync(reply, cancellationToken);
}

如您所见，不需要英雄卡或卡牌动作。在此示例中，使用通过 ChannelData 传递的 button template 调用 Facebook webview，这是特定于频道的活动中的元数据。 Messenger 读取该数据并为您创建看起来像卡片的东西。

请确保您 whitelist your domain 以使其正常工作。