提示用户使用MS Bot Framwork v4在对话框流中上载文件 [英] Prompt User to Upload file in Dialog Flow with MS Bot Framwork v4

查看:67
本文介绍了提示用户使用MS Bot Framwork v4在对话框流中上载文件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个对话框流程,要求用户上载一个或多个文件.我想提示用户,让他们单击一个按钮以打开文件浏览窗口,以选择他们要上传的文件.我不想在WebChat窗口文本输入框中使用文件选择器(用户会感到困惑).这可能吗?我在v3文档中看到有一个AttachmentPrompt对话框.但是,在v4文档中,我只看到它在一个衬里中提到过...

I have a dialog flow that will require a user to upload a file/files. I would like to prompt the user and have them click on a button to open a file browse window to select the file they want to upload. I do not want to use the file chooser in the WebChat window text entry box (Users find this confusing). Is this possible? I saw in the documentation for v3 that there is a AttachmentPrompt dialog. However in the documentation for v4 I only see it mentioned in a one liner here... https://docs.microsoft.com/en-us/azure/bot-service/bot-builder-concept-dialog?view=azure-bot-service-4.0 however other than that which sounds promising there appears to be no documentation on this functionality.

感谢您提供的任何帮助!

Thanks for any help you can provide!

推荐答案

PromptAttachment 未定义客户端渲染或客户端文件上传代码.为了使WebChat控件响应自定义按钮,您需要为Web聊天控件提供附件中间件,并让漫游器发送自定义附件类型.

PromptAttachment does not define client side rendering, or client side file upload code. In order to have the WebChat control respond to a custom button, you will need to provide an Attachment Middleware for the Web Chat control, and have the bot send a custom attachment type.

自定义附件:

private class FileUpload : Attachment
{
    public FileUpload()
        : base("application/uploadAttachment") { }
}

使用FileUpload附件答复:

Replying with FileUpload attachment:

var reply = activity.CreateReply("Upload a File");                        
reply.Attachments.Add(new FileUpload());
await connector.Conversations.SendToConversationAsync(reply);

网页托管网络聊天:

<!DOCTYPE html>
<html>
<body>
    <div id="webchat" />

    <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
    <script src="https://unpkg.com/react@16.5.0/umd/react.development.js"></script>
    <script src="https://unpkg.com/react-dom@16.5.0/umd/react-dom.development.js"></script>
    <script src="https://unpkg.com/react-redux@5.0.7/dist/react-redux.min.js"></script>
    <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>

    <script>
        function uploadFile() {
            document.querySelector('[title="Upload file"]').click();
        }

    </script>
    <script type="text/babel">
        var chatbot = new WebChat.createDirectLine({
            token: 'YourToken',
            webSocket: true,
        });

        const attachmentMiddleware = () => next => card => {
            switch (card.attachment.contentType) {
                case 'application/uploadAttachment':
                    return (<button type="button" onClick={uploadFile}>Upload file</button>);

                default:
                    return next(card);
            }
        };

        WebChat.renderWebChat({
            directLine: chatbot,
            botAvatarInitials: 'Bot',
            attachmentMiddleware,
        }, document.getElementById('webchat'));

    </script>
</body>
</html>

这篇关于提示用户使用MS Bot Framwork v4在对话框流中上载文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆