Quick Reference - Send a text message:
- Text Message is the most common and standard message type.
- Media Message, for sending photos, videos and files.
- Custom Message, for sending completely custom data using JSON structures.
- Interactive Message for sending end-user interactive messages of type form, card and custom interactive.
Text Message
In other words, as a sender, how do I send a text message? To send a text message to a single user or group, you need to use thesendMessage() method and pass a TextMessage object to it.
Add Metadata
To send custom data along with a text message, you can use thesetMetadata method and pass a JSON Object to it.
- JavaScript
- TypeScript
Add Tags
To add a tag to a message you can use thesetTags() method of the TextMessage Class. The setTags() method accepts a list of tags.
- JavaScript
- TypeScript
sendMessage() method to send the text message to the recipient.
- To User
- To Group
- TypeScript (User)
- TypeScript (Group)
TextMessage class constructor takes the following parameters:
When a text message is sent successfully, the response will include a
TextMessage object which includes all information related to the sent message.
Response
Response
On Success — Returns a TextMessage object:TextMessage Object:
sender Object:receiver Object:data Object:data.entities Object:data.entities.sender Object:data.entities.sender.entity Object:data.entities.receiver Object:data.entities.receiver.entity Object:data.moderation Object:Set Quoted Message Id
To set a quoted message ID for a message, use thesetQuotedMessageId() method of the TextMessage class. This method accepts the ID of the message to be quoted.
- JavaScript
- TypeScript
sendMessage() method to send the text message to the recipient.
- To User
- To Group
- TypeScript (User)
- TypeScript (Group)
TextMessage class constructor takes the following parameters:
When a text message is sent successfully, the response will include a
TextMessage object which includes all information related to the sent message.
Media Message
In other words, as a sender, how do I send a media message like photos, videos & files? To send a media message to any user or group, you need to use thesendMediaMessage() method and pass a MediaMessage object to it.
Add Metadata
To send custom data along with a media message, you can use thesetMetadata method and pass a JSON Object to it.
- JavaScript
- TypeScript
Add Caption (Text along with Media Message)
To send a caption with a media message, you can use thesetCaption method and pass text to it.
- JavaScript
- TypeScript
Add Tags
To add a tag to a message you can use thesetTags() method of the MediaMessage Class. The setTags() method accepts a list of tags.
- JavaScript
- TypeScript
1. By Providing the File
You can directly share the file object while creating an object of the MediaMessage class. When the media message is sent using thesendMediaMessage() method, this file is then uploaded to CometChat servers and the URL of the file is sent in the success response of the sendMediaMessage() function.
Getting the file Object: You can use different React Native packages for sending media messages. We demonstrate how to send images using CometChat.
- To User
- To Group
- TypeScript (User)
- TypeScript (Group)
MediaMessage class constructor takes the following parameters:
Response
Response
On Success — Returns a MediaMessage object:MediaMessage Object:
sender Object:receiver Object:data Object:data.attachments Array (per item):data.entities Object:data.entities.sender Object:data.entities.sender.entity Object:data.entities.receiver Object:data.entities.receiver.entity Object:2. By Providing the URL of the File
The second way to send media messages using the CometChat SDK is to provide the SDK with the URL of any file that is hosted on your servers or any cloud storage. To achieve this you will have to make use of the Attachment class. For more information, you can refer to the below code snippet:- To User
- To Group
- TypeScript (User)
- TypeScript (Group)
MediaMessage object which includes all information related to the sent message.
Response
Response
On Success — Returns a MediaMessage object:MediaMessage Object:
sender Object:receiver Object:data Object:data.attachments Array (per item):data.entities Object:data.entities.sender Object:data.entities.sender.entity Object:data.entities.receiver Object:data.entities.receiver.entity Object:Multiple Attachments in a Media Message
Starting version 3.0.9 & above the SDK supports sending multiple attachments in a single media message. As in the case of a single attachment in a media message, there are two ways you can send Media Messages using the CometChat SDK:1. By Providing an Array of Files
You can now share an array of files while creating an object of the MediaMessage class. When the media message is sent using thesendMediaMessage() method, the files are uploaded to the CometChat servers & the URL of the files is sent in the success response of the sendMediaMessage() method.
Getting the file Object: You can use different React Native packages for sending media messages. We demonstrate how to send images using CometChat.
- To User
- To Group
- TypeScript (User)
- TypeScript (Group)
MediaMessage class constructor takes the following parameters:
2. By Providing the URL of Multiple Files
The second way to send multiple attachments in a single media message using the CometChat SDK is to provide the SDK with the URL of multiple files that are hosted on your servers or any cloud storage. To achieve this you will have to make use of the Attachment class. For more information, you can refer to the below code snippet:- To User
- To Group
- TypeScript (User)
- TypeScript (Group)
MediaMessage object which includes all information related to the sent message.
You can use the setMetadata(), setCaption() & setTags() methods to add metadata, caption and tags respectively in exactly the same way as it is done while sending a single file or attachment in a Media Message.
Response
Response
On Success — Returns a MediaMessage object with multiple attachments:MediaMessage Object:
sender Object:receiver Object:data Object:data.attachments Array (per item):Example with multiple attachments:
- Attachment 1:
{"name": "mario", "extension": "png", "mimeType": "image/png", "url": "https://pngimg.com/uploads/mario/mario_PNG125.png"} - Attachment 2:
{"name": "jaguar", "extension": "png", "mimeType": "image/png", "url": "https://pngimg.com/uploads/jaguar/jaguar_PNG20759.png"}
data.entities Object:data.entities.sender Object:data.entities.sender.entity Object:data.entities.receiver Object:data.entities.receiver.entity Object:Custom Message
In other words, as a sender, how do I send a custom message like location coordinates? CometChat allows you to send custom messages which are neither text nor media messages. In order to send a custom message, you need to use thesendCustomMessage() method. The sendCustomMessage() method takes an object of the CustomMessage which can be obtained using the below constructor.
- JavaScript
- TypeScript
custom.
The parameters involved are:
You can also use the subType field of the
CustomMessage class to set a specific type for the custom message. This can be achieved using the setSubtype() method.
Add Tags
To add a tag to a message you can use thesetTags() method of the CustomMessage Class. The setTags() method accepts a list of tags.
- JavaScript
- TypeScript
CustomMessage class is ready you can send the custom message using the sendCustomMessage() method.
- To User
- To Group
- TypeScript (User)
- TypeScript (Group)
CustomMessage class.
Response
Response
On Success — Returns a CustomMessage object:CustomMessage Object:
customData Object:sender Object:receiver Object:data Object:data.entities Object:data.entities.sender Object:data.entities.sender.entity Object:data.entities.receiver Object:data.entities.receiver.entity Object:Update Conversation
How can I decide whether the custom message should update the last message of a conversation? By default, a custom message will update the last message of a conversation. If you wish to not update the last message of the conversation when a custom message is sent, please useshouldUpdateConversation(value: boolean) method of the Custom Message.
- To User
- To Group
- TypeScript (User)
- TypeScript (Group)
Custom Notification Body
How can I customize the notification body of a custom message? To add a custom notification body forPush, Email & SMS notification of a custom message you can use the setConversationText(text: string) method of the CustomMessage class.
- To User
- To Group
- TypeScript (User)
- TypeScript (Group)
It is also possible to send interactive messages from CometChat. To learn more, see Interactive Messages.
Best Practices
Best Practices
- Use appropriate message types (
TEXT,IMAGE,VIDEO,AUDIO,FILE) for media messages - Add metadata to messages when you need to pass additional context (e.g., location, user preferences)
- Use tags to categorize messages for easier filtering and retrieval
- Set
shouldUpdateConversation(false)for background or system-level custom messages that shouldn’t appear in conversation lists - Use
setConversationText()to provide meaningful notification text for custom messages
Troubleshooting
Troubleshooting
- Message not sending: Ensure the user is logged in and CometChat is initialized
- Media upload fails: Check file size limits and ensure the file object has correct
name,type, anduriproperties - Custom message not appearing: Verify the receiver UID/GUID is correct and the receiver type matches
- Notifications not showing custom text: Make sure
setConversationText()is called before sending the message
Next Steps
Receive Messages
Listen for real-time messages and fetch missed messages
Edit a Message
Edit previously sent messages
Interactive Messages
Send forms, cards, and custom interactive messages
Typing Indicators
Show real-time typing status in conversations