Are you sure you want to delete this access key?
A sample bot that passes simple media attachments (images) to a message.
The minimum prerequisites to run this sample are:
Many messaging channels provide the ability to attach richer objects. Bot Builder lets you express these attachments in a cross channel way and connectors will do their best to render the attachments using the channels native constructs. If you desire more control over the channels rendering of a message you can use Message.sourceEvent to provide attachments using the channels native schema. The types of attachments that can be sent varies by channel but these are the basic types:
As a developer, you have three ways to send the attachment. The attachment can be:
It consists on sending the file contents, encoded in base64, along with the message payload. This option works for small files, like icon size images.
You'll need to encode file's content, then set the attachment's contentUrl
as follows:
data:image/png;base64,iVBORw0KGgo…
Checkout app.js to see how to convert a file read using fs.readFile()
and then create the message attachment.
fs.readFile('./images/small-image.png', function (err, data) {
var contentType = 'image/png';
var base64 = Buffer.from(data).toString('base64');
var msg = new builder.Message(session)
.addAttachment({
contentUrl: util.format('data:%s;base64,%s', contentType, base64),
contentType: contentType,
name: 'BotFrameworkLogo.png'
});
session.send(msg);
});
This option should be used when the file to send is less than 256Kb in size when encoded to base64. A good scenario are images generated based on user input. It does require a few more steps than the other methods, but leverages the channels store to store the file:
This sample provides a helper method you can use that encapsulates most of the previous steps.
// read file content and upload
fs.readFile('./images/big-image.png', function (err, data) {
if (err) {
return session.send('Oops. Error reading file.');
}
// Upload file data using helper function
uploadAttachment(
data,
'image/png',
'BotFrameworkImage.png',
connector,
connectorApiClient,
session.message.address.serviceUrl,
session.message.address.conversation.id)
.then(function (attachmentUrl) {
// Send Message with Attachment obj using returned Url
var msg = new builder.Message(session)
.addAttachment({
contentUrl: attachmentUrl,
contentType: 'image/png',
name: 'BotFrameworkLogo.png'
});
session.send(msg);
})
.catch(function (err) {
console.log('Error uploading file', err);
session.send('Oops. Error uploading file. ' + err.message);
});
});
This option is the simplest but requires the image to be already on the Internet and be publicly accesible. You could also provide an Url pointing to your own site.
Checkout app.js to see how to create a message with a single image attachment.
var msg = new builder.Message(session)
.addAttachment({
contentUrl: 'https://docs.botframework.com/en-us/images/faq-overview/botframework_overview_july.png',
contentType: 'image/png',
name: 'BotFrameworkOverview.png'
});
session.send(msg);
You will see the following in the Bot Framework Emulator when selecting the inline attachment. See how the image is encoded in the contentUrl
of the attachment.
You will see the following in your Facebook Messenger when selecting to upload the attachment.
On the other hand, you will see the following in Skype when selecting an Internet attachment.
To get more information about how to get started in Bot Builder for Node and Attachments please review the following resources:
Press p or to see the previous file or, n or to see the next file
Are you sure you want to delete this access key?
Are you sure you want to delete this access key?
Are you sure you want to delete this access key?
Are you sure you want to delete this access key?