Amazon Connect now supports asynchronous chat! Customers can chat from a website, mobile app, SMS, or a variety of messaging services. All you need is to do is build the integration.
In this blog, we will cover how such an integration is built. We will focus on a common use case: a chat widget embedded on a customer-facing website.
Scenario
We’d like our customers to initiate chat sessions through our product’s website. We expect our customers to ask about product information, order statuses, refunds, and special offers. We’ll use a chat widget, embedded on the product’s website, to connect our customers. It will look something like this.
Implementation
We will use the new chat APIs from Amazon to create the chat widget. In this blog, we will focus on three features: sending chats, receiving chats, and conversation history.
To start, let’s highlight a few of the new chat APIs.
Note: The listed input and output parameters is not exhaustive, but only the minimum needed to understand the purpose of each API call. See the references below for full API documentation.
Amazon Connect Service
StartChatContact
Initiates a contact flow for chat. Returns token that can be used to open a participant’s connection.
API Input
| Parameter | Purpose |
| Contact attributes | Map of contact attributes to pass to the contact flow |
| Client token | Unique, client-defined identifier for the request |
| Contact flow ID | ID of the contact flow to initiate |
| Instance ID | ID of the Amazon Connect instance |
API Output
| Parameter | Purpose |
| Contact ID | Contact ID for this contact |
| Participant ID | ID for this participant |
| Participant Token | Token to call further APIs on behalf of the participant |
Amazon Connect Participant Service
CreateParticipantConnection
Creates a connection for a participant in the chat. Returns a WebSocket that must be subscribed to for incoming messages.
API Input
| Parameter | Purpose |
| Participant Token (header) | The participant token from StartChatContact |
API Output
| Parameter | Purpose |
| WebSocket | Url of the WebSocket used to receive incoming messages |
Avoid Contact Center Outages: Plan Your Upgrade to Amazon Connect
Learn the six most common pitfalls when upgrading your contact center, and how Amazon Connect can help you avoid them.
GetTranscript
Gets the conversation history for the contact.
API Input
| Parameter | Purpose |
| Contact ID | ID of the contact returned by StartChatContact |
| Batch parameters | Set of parameters (i.e. max results, scan direction, sort order, start position) to determine the returned messages |
| Connection token (header) | Token returned by CreateParticipantConnection |
API Output
| Parameter | Purpose |
| Transcript | Conversation history for the contact |
SendMessage
Sends a chat message, i.e. a message from the customer to Connect.
API Input
| Parameter | Purpose |
| Client token | Identifier set during StartChatContact |
| Content | The message text |
| Content type | The message content type, set to ‘text/plain’ |
| Connection token (header) | Token returned by CreateParticipantConnection |
We can use these API calls to send chats, receive chats, and get conversation history. Take a look at the following diagram to see how.
- Start a chat session with StartChatContact
- Create a connection to receive messages with CreateParticipantConnection, which returns the chat WebSocket
- Get conversation history with GetTranscript
- Receive chats via the chat Web Socket returned by CreateParticipantConnection
- Send chats with SendMessage
And that’s it!
You can now send and receive chats from a chat widget, as well as get conversation history. Next, you can build out the UI for the chat widget. To see an example UI and implementation, please take a look at the referenced Amazon sample below.
You may have noticed that nothing we discussed is chat widget-specific. You can use the above API calls to develop an integration for any message-based platform. Good luck building!
References
Check the AWS documentation to learn more about the new chat APIs and integrations.
Also, take a look at Amazon’s sample chat widget for more code samples.
And, here is the API documentation you’ll need for a deeper dive.
