Sending Messages and Media

If you'd like to send your Message as a one-shot method call, you can use this basic method.

1
//send a basic message into the Conversation
2
await conversation.sendMessage('hello world');

We also provide a more flexible method that allows you to programmatically build your message. This method is more robust and is typically ideal for most use cases.

The Message Builder class allows you to build a new text and/or media Message and makes the Message ready to be sent to the Conversation.

When creating the MessageBuilder object, you'll set each property of the message individually. For example, you'll set the body and the message attributes separately.

1
/* Using MessageBuilder */
2
// Message builder. Allows the message to be built and sent via method chaining.
3

4
await testConversation.prepareMessage()
5
    .setBody('Hello!')
6
    .setAttributes({foo: 'bar'})
7
    .addMedia(media1)
8
    .addMedia(media2)
9
    .build()
10
    .send();

You can add photos, videos, and other types of media files to your Conversation. Media is displayed seamlessly between all participating channels.

To add a media Message (i.e. photos, videos) to your Conversation, you'll need to create a Message and add a media file, filename and content type to the Message Builder.

1
const file = await fetch("https://v.fastcdn.co/u/ed1a9b17/52533501-0-logo.svg");
2
const fileBlob = await file.blob();
3

4
// Send a media message
5
const sendMediaOptions = {
6
    contentType: file.headers.get("Content-Type"),
7
    filename: "twilio-logo.svg",
8
    media: fileBlob
9
};
10

11
await conversation.prepareMessage().addMedia(sendMediaOptions);

Each SDK accepts media input differently:

For JS, use:

• A String or Node.js Buffer containing a media byte stream
• A new FormData object containing file information: filename, content-type, size, and all required FormData information

For iOS, use:

• an InputStream
• an NSInputStream-compliant stream
• an NSData buffer

For Android, use:

• any java.io.InputStream-compliant stream

You can also attach multiple media items to a single message by using the Message Builder.

1
/* Send multiple media */
2

3
const file = await fetch("https://v.fastcdn.co/u/ed1a9b17/52533501-0-logo.svg");
4
const fileBlob = await file.blob();
5

6
const mediaFormData = new FormData();
7
mediaFormData.set("twilio-logo", fileBlob, "twilio-logo.svg");
8

9
const sendMediaOptions = {
10
    contentType: file.headers.get("Content-Type"),
11
    filename: "twilio-logo.svg",
12
    media: fileBlob
13
};
14

15
await testConversation.prepareMessage()
16
    .setBody("Hello!")
17
    // add multiple media
18
    .addMedia(mediaFormData)
19
    .addMedia(sendMediaOptions)
20
    // ...
21
    .addMedia(mediaN)
22
    .build()
23
    .send();

You can get a short-lived, temporary URL to download the media content in a Conversation.

If a message has more than one attachment, an array of media Messages can be retrieved, but it has to match the specific category of media.

You can use your preferred method to retrieve the content from the temporary URL and render it in your UI.

1
/* Check and update Media samples */
2

3
// Return all media attachments, without temporary urls
4
const media = message.attachedMedia;
5

6
// Return a (possibly empty) array of media matching a specific set of categories. Allowed category is so far only 'media'
7
const categorizedMedia = await message.getMediaByCategory(["media"]);
8

9
//Get a temporary URL for the first media returned by the previous method
10
const mediaUrl = await categorizedMedia[0].getContentTemporaryUrl();

Conversations is a cross-channel messaging product, so each channel has a different set of limitations about incoming media files. Please refer to theMedia Limits documentation for channel-specific information and supported file types.

Media content is encrypted and can not be downloaded directly. When required, only authenticated users can generate temporary/expiring URLs to download the media content. The temporary URLs are valid for 300 seconds, after which a new temporary URL must be requested.

Let's learn other features in Twilio Conversations:

• Explore the User Reachability Indicator guide
• Learn How to Receive and Send Typing Indicators