Chat Attachments
This guide is for Flex UI 1.x and channels that use Programmable Chat and Proxy. If you are using Flex UI 2.x or you are starting out, we recommend that you build with Flex Conversations.
This Twilio product is currently available as a Public Beta release. Some features are not yet implemented and others may be changed before the product is declared as Generally Available. Beta products are not covered by a Twilio SLA. Learn more about beta product support.
Once Flex Webchat attachments are enabled, you can start sending files via Flex web chat.
Send and receive files via web chat
Agents and customers will see the messaging canvas with any previous messages sent and received between them. At the bottom of the message canvas is the message input where you type out your replies, which includes the attachment button.
Clicking it will open your Operating System’s file picker which you can use to navigate your file structure and select the file you want to send. The chosen file will appear in a preview of the message with the file name and size shown. Click the send button to send the file or click the remove button to clear the file from the message input.
Agents will see an error notification if the file doesn’t meet the size or type restrictions you’ve configured.
When the attachment has been sent you’ll see the file preview in the chat history. If customers are able to send you files they will also appear in the chat history.
You can click the file preview to open the file. Depending on the file type it may open as a preview in your browser or be downloaded to your device. You may be prompted to select a location on your computer to save the file.
If the attachment fails to send you’ll be notified with a warning. You’ll need to re-select the file and send it again.
You can also drag-n-drop files into the Messaging Canvas to send them. Once you have dragged the file in, it will appear in the Message Input and you can send it right away or add text to the message before sending.
Next Steps
- Learn how to enable chat attachments in Flex
- Discover the programmability of chat attachments
- Learn more about Flex Webchat
Need some help?
We all do sometimes; code is hard. Get help now from our support team, or lean on the wisdom of the crowd by visiting Twilio's Stack Overflow Collective or browsing the Twilio tag on Stack Overflow.
