Microsoft Bot Framework WebChat：添加机器人图像

Question

如何在 Microsoft Bot Framework Web Chat 中添加带有欢迎文字的机器人图像。似乎是很常见的功能，我看到的图像表明这是可能的。

有人知道怎么添加吗？

Answer 1

好的，这就是我们最终要做的事情：

<script>
    $(document).ready(function () {
        $(".wc-header").append("<div class='wc-header-welcome'><img src='/Images/bot.png'/><div>Hello! I am your bot</div>");
    });
</script>

希望它能帮助其他人节省时间。

Answer 2

您可以使用下面的代码并替换您的图片路径，以从机器人向用户提供响应，包括文本和图片。

await context.PostAsync("Here we go with the welcome message\n"+"![AN IMAGE!](Your_Image_URL)");

另一种方法是，您还可以使用卡片功能：

private async Task Greeting(IDialogContext context, IAwaitable<IMessageActivity> argument)
        {
            var message = await argument;
            if (string.IsNullOrEmpty(message.Text))
            {

                // Hero Card
                var cardMsg = context.MakeMessage();
                var attachment = BotWelcomeCard("Hello,I am a bot.", "");
                cardMsg.Attachments.Add(attachment);
                await context.PostAsync(cardMsg);

            }
            else
            {             
               // else code
            }
        }


 private static Attachment BotWelcomeCard(string responseFromQNAMaker, string userQuery)
        {
            var heroCard = new HeroCard
            {
                Title = userQuery,
                Subtitle = "",
                Text = responseFromQNAMaker,
                Images = new List<CardImage> { new CardImage("../img/bot.gif") },
                Buttons = new List<CardAction> { new CardAction(ActionTypes.ImBack, "Show Menu", value: "Show Bot Menu") }
            };

            return heroCard.ToAttachment();
        }

Microsoft Bot Framework WebChat：添加机器人图像

Microsoft Bot Framework WebChat: Add bot image

bots

web-chat

mbf