javascript - 机器人不会在直线中自行发送欢迎消息

标签 javascript c# asp.net-mvc botframework direct-line-botframework

我使用 bot 框架 v4 c# 在本地创建了一个机器人。它有一张欢迎卡,当我将本地 url 连接到模拟器时,它会自动弹出,但最近我在 azure 上部署了我的机器人,并使用直接线路 channel 将其集成到我的网站中。现在,每当我单击时,它都会打开机器人,但欢迎卡不会自行出现,当我从聊天机器人中写一些东西时,它就会出现。我只希望欢迎卡在模拟器中自动出现。伙计们,你能帮我一下吗?下面是我在我的网站中集成的直线代码。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<!-- Paste line 7 to 27 after the title tag in _Layout.cshtml -->
<link href="https://cdn.botframework.com/botframework-webchat/latest/botchat.css" rel="stylesheet" 
/>
<script src="https://cdn.botframework.com/botframework-webchat/latest/botchat.js"></script>
<style>
    #mychat {
        margin: 10px;
        position: fixed;
        bottom: 30px;
        left: 10px;
        z-index: 1000000;
    }

    .botIcon {
        float: left !important;
        border-radius: 50%;
    }

    .userIcon {
        float: right !important;
        border-radius: 50%;
    }
</style>
</head>
< body>
<!-- Paste line from 31 to 33 before the </body> tag at the end of code -->
<div id="container">
    <img id="mychat" src=""/>
</div>
</body>

<!-- Paste line 38 to 88 after the </html> tag -->
<script>
(function () {
    var div = document.createElement("div");

    var user = {
                id: "",
                name: ''
            };

    var bot = {
                id: '',
                name: 'SaathiBot'
            };

    const botConnection = new BotChat.DirectLine({

                secret: '',

                webSocket: false 
            })        

    document.getElementsByTagName('body')[0].appendChild(div);

    div.outerHTML = "<div id='botDiv' style='width: 400px; height: 0px; margin:10px; position: 
fixed; bottom: 0; left:0; z-index: 1000;><div  id='botTitleBar' style='height: 40px; width: 400px; 

位置:固定;光标:指针;'>";

    BotChat.App({
                botConnection: botConnection, 
                user: user,
                bot: bot 
            }, document.getElementById("botDiv"));

    document.getElementsByClassName("wc-header")[0].setAttribute("id", "chatbotheader");
    document.querySelector('body').addEventListener('click', function (e) {
        e.target.matches = e.target.matches || e.target.msMatchesSelector;
        if (e.target.matches('#chatbotheader')) {
            var botDiv = document.querySelector('#botDiv');

            botDiv.style.height = "0px";

            document.getElementById("mychat").style.display = "block";
        };
    });

    document.getElementById("mychat").addEventListener("click", function (e) {

        document.getElementById("botDiv").style.height = '500px';

        e.target.style.display = "none";
    })
    }());
 </script>

这也是我用 c# 编写的欢迎卡代码

namespace Microsoft.BotBuilderSamples
{
public class WelcomeUser : SaathiDialogBot<MainDialog>
{

    protected readonly string[] _cards =
    {
        Path.Combine(".", "Resources", "WelcomeCard.json"),

    };

    public WelcomeUser(ConversationState conversationState, UserState userState, MainDialog dialog, ILogger<SaathiDialogBot<MainDialog>> logger)
        : base(conversationState, userState, dialog, logger)
    {
    }

    protected override async Task OnMembersAddedAsync(IList<ChannelAccount> membersAdded, ITurnContext<IConversationUpdateActivity> turnContext, CancellationToken cancellationToken)
    {
        await SendWelcomeMessageAsync(turnContext, cancellationToken);
        Random r = new Random();
        var cardAttachment = CreateAdaptiveCardAttachment(_cards[r.Next(_cards.Length)]);
        await turnContext.SendActivityAsync(MessageFactory.Attachment(cardAttachment), cancellationToken);
    }


    private static async Task SendWelcomeMessageAsync(ITurnContext turnContext, CancellationToken cancellationToken)
    {
        foreach (var member in turnContext.Activity.MembersAdded)
        {
            if (member.Id != turnContext.Activity.Recipient.Id)
            {

                if (DateTime.Now.Hour < 12)
                {

                    await turnContext.SendActivityAsync(
                        $"Hi,Good Morning {member.Name}",
                        cancellationToken: cancellationToken);

                }
                else if (DateTime.Now.Hour < 17)
                {

                    await turnContext.SendActivityAsync(
                        $"Hi,Good Afternoon {member.Name}",
                        cancellationToken: cancellationToken);
                }
                else
                {

                    await turnContext.SendActivityAsync(
                        $"Hi,Good Evening {member.Name}",
                        cancellationToken: cancellationToken);


                }
            }
        }

    }
    private static Attachment CreateAdaptiveCardAttachment(string filePath)
    {
        var adaptiveCardJson = File.ReadAllText(filePath);
        var adaptiveCardAttachment = new Attachment()
        {
            ContentType = "application/vnd.microsoft.card.adaptive",
            Content = JsonConvert.DeserializeObject(adaptiveCardJson),
        };
        return adaptiveCardAttachment;
    }
    }
}

这里是欢迎卡中继承的saathiDialog代码。这是我的 bot 文件夹中的两个文件

namespace Microsoft.BotBuilderSamples
{
public class SaathiDialogBot<T> : ActivityHandler where T : Dialog
{
    protected readonly BotState ConversationState;
    protected readonly Dialog Dialog;
    protected readonly ILogger Logger;
    protected readonly BotState UserState;
    private DialogSet Dialogs { get; set; }

    public SaathiDialogBot(ConversationState conversationState, UserState userState, T dialog, ILogger<SaathiDialogBot<T>> logger)
    {
        ConversationState = conversationState;
        UserState = userState;
        Dialog = dialog;
        Logger = logger;
    }

    public override async Task OnTurnAsync(ITurnContext turnContext, CancellationToken cancellationToken = default(CancellationToken))
    {
        var activity = turnContext.Activity;

        if (string.IsNullOrWhiteSpace(activity.Text) && activity.Value != null)
        {
            activity.Text = JsonConvert.SerializeObject(activity.Value);
        }
        if (turnContext.Activity.Text == "Yes")
        {

            await turnContext.SendActivityAsync($"Good bye. I will be here if you need me. ", cancellationToken: cancellationToken);
            await turnContext.SendActivityAsync($"Say Hi to wake me up.", cancellationToken: cancellationToken);
        }
        else
        {
            await base.OnTurnAsync(turnContext, cancellationToken);
        }
        await ConversationState.SaveChangesAsync(turnContext, false, cancellationToken);
        await UserState.SaveChangesAsync(turnContext, false, cancellationToken);
    }

    protected override async Task OnMessageActivityAsync(ITurnContext<IMessageActivity> turnContext, CancellationToken cancellationToken)
        {
            Logger.LogInformation("Running dialog with Message Activity.");
            await Dialog.RunAsync(turnContext, ConversationState.CreateProperty<DialogState>(nameof(DialogState)), cancellationToken);
        }

 }
}

最佳答案

If you are using WebChat or directline, the bot’s ConversationUpdate is sent when the conversation is created and the user sides’ ConversationUpdate is sent when they first send a message. When ConversationUpdate is initially sent, there isn’t enough information in the message to construct the dialog stack. The reason that this appears to work in the emulator, is that the emulator simulates a sort of pseudo DirectLine, but both conversationUpdates are resolved at the same time in the emulator, and this is not the case for how the actual service performs.

解决方法是在建立 DirectLine 连接时向机器人发送反向 channel 欢迎事件,并从 onEventAsync 处理程序而不是 onMembersAdded 发送欢迎消息。

  • 用于网络聊天的嵌入式 HTML
<!DOCTYPE html>
<html>
  <head>
    <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
    <style>
      #webchat {
        height: 100%;
        width: 100%;
      }
    </style>

  </head>
  <body>
    <div style="display: flex">
      <div style="position: relative; height: 500px; width: 500px"><div id="bot" ></div></div>
    </div>
    <script>
      (async function() {
        const res = await fetch('/directline/token', { method: 'POST' });
        const { token }  = await res.json();
        var userinfo = {
              id: 'user-id',
              name: 'user name',
              locale: 'es'
          };

        var botConnection = new window.BotChat.DirectLine({ token });

        botConnection.connectionStatus$
          .subscribe(connectionStatus => {
              switch(connectionStatus) {
                  case window.BotChat.ConnectionStatus.Online:
                    botConnection.postActivity({
                        from: { id: 'myUserId', name: 'myUserName' },
                        type: 'event',
                        name: 'webchat/join',
                        value: { locale: 'en-US' }
                    }).subscribe(
                        id => console.log("Posted welcome event, assigned ID ", id),
                        error => console.log("Error posting activity", error)
                    );
                    break;
              }
          });


        BotChat.App({
          botConnection: botConnection,
          user: userinfo,
          bot: { id: 'botid' },
          resize: 'detect'
        }, document.getElementById("bot"));

      })().catch(err => console.log(err));

    </script>
  </body>
</html>
  • C# 机器人代码
protected override async Task OnEventActivityAsync(ITurnContext<IEventActivity> turnContext, CancellationToken cancellationToken)
{
    if (turnContext.Activity.Name == "webchat/join") {
      await turnContext.SendActivityAsync("Welcome Message!");
    }
}

protected override async Task OnMembersAddedAsync(IList<ChannelAccount> membersAdded, ITurnContext<IConversationUpdateActivity> turnContext, CancellationToken cancellationToken)
{
    if (turnContext.Activity.ChannelId != "webchat" && turnContext.Activity.ChannelId != "directline") {

        foreach (var member in membersAdded)
        {
            if (member.Id != turnContext.Activity.Recipient.Id)
            {
                await turnContext.SendActivityAsync($"Hi there - {member.Name}. {WelcomeMessage}", cancellationToken: cancellationToken);
                await turnContext.SendActivityAsync(InfoMessage, cancellationToken: cancellationToken);
                await turnContext.SendActivityAsync(PatternMessage, cancellationToken: cancellationToken);
            }
        }
    }
}

希望这有帮助。

关于javascript - 机器人不会在直线中自行发送欢迎消息,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59278281/

相关文章:

c# - Wpf Web 浏览器刷新

c# - LINQ 获得最高值并 + 1

c# - 只应验证最小/最大长度

asp.net - 将ASP.NET的 "ReturnURL"转为绝对URL

c# - DbContext 已被释放

javascript - 用于本地主机的 Google Maps v3 api 无法正常工作

javascript - TypeError : $. ajax(...).done(...).fail(...).complete 不是函数

javascript - eventListener 适用于应该位于函数私有(private)范围内的变量

javascript - 仅使用js在HTML页面中显示API请求结果

c# - 为什么尾随 %20(在本例中为有效数据)会终止 asp.net mvc 路由