提示用户使用MS Bot Framwork v4在对话框流中上载文件 [英] Prompt User to Upload file in Dialog Flow with 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屋!