如何在网络聊天中添加聊天机器人v4头像图标？

Question

我必须添加一个头像到机器人响应，但我找不到这样做的方法。

我尝试过botAvatarInitials和userAvatarInitials Change the avatar of the bot within the dialog box ，但这并不是我想要的。

    window.WebChat.renderWebChat({
        directLine: botConnection,
        styleOptions: styleOptions,
        botAvatarInitials: 'BOT',
        userAvatarInitials: 'YOU'
    }, document.getElementById('webchat'));

有使用图像的方法吗？或者至少改变头像的气泡颜色？

Answer 1

可以，您可以使用this sample中所述的botAvatarImage属性来设置图像。

它看起来像这样：

const styleOptions = {
    botAvatarImage: 'https://docs.microsoft.com/en-us/azure/bot-service/v4sdk/media/logo_bot.svg?view=azure-bot-service-4.0',
    botAvatarInitials: 'BF',
    userAvatarImage: 'https://github.com/compulim.png?size=64',
    userAvatarInitials: 'WC'
};

window.WebChat.renderWebChat({
    directLine: botConnection,
    styleOptions
 }, document.getElementById('webchat'));

要设置头像气泡的背景，可以执行以下操作：

const styleOptions = {
    bubbleBackground: 'rgba(0, 0, 255, .1)',
    bubbleFromUserBackground: 'rgba(0, 255, 0, .1)'
};

window.WebChat.renderWebChat({
    directLine: botConnection,
    styleOptions
}, document.getElementById('webchat'));