Message

You can send a message in a chat room, and other user get the message, push notification, and unread count as long as they are participant in that chat room.

Qiscus Chat SDK has 3 statues, which are sent, delivered, read for a message. Once message is sent, the OnReceiveMessage event handler will be called. To understand this part, you can refer to Event Handler.

Sent, delivered, and read receipt in a message only work on 1-on-1 Chat and Group Chat. Hence, you may not get these message receipts in a Channel type.

In Message, you can add metadata called extras. The extras is automatically synchronized by each participant in a Chat Room.

Sent, delivered, and read receipt in a message only work on 1-on-1 Chat and Group Chat

Send Message

You can send a text message or custom message type. Ideal case for custom message is for creating custom UI message needs by sending structured data, such as you need to send location message, a ticket concert message, a product info, and others UI message that need to be customized.

Send a text comment:

Javascript
    
 
qiscus.sendComment(roomId, text)    .then(function (comment) {        // On success    })    .catch(function (error) {        // On error    })
Copy

Send a custom comment type,

Javascript
    
 
qiscus.sendComment(roomId, text, uniqueId, type, payload, extras)    .then(function (comment) {        // On success    })    .catch(function (error) {        // On error    })
Copy

Where:

roomId: chat room Identity (Id), you can get this Id in chat room object
text: message text that you send to other participant
uniqueId: temporary id to identify comment data, should be unique value, example you can use timestamp.
type: message type, that you can define freely, there are reserved rich messages type, for example: text, file_attachment, account_linking, buttons, button_postback_response, reply, system_event, card, custom, location, contact_person, carousel. These type have been taken, if you use it you may face your structured data will not work, these type for bot API, hence you need define other type name.
payload: Payload for defining the structured message data, for example you want to create your own file message, you can fill the content using this example JSON :

JSON
    
{  "url": "https://d1edrlpyc25xu0.cloudfront.net/sampleapp-65ghcsaysse/docs/upload/2sxErjgAfp/Android-Studio-Shortcuts-You-Need-the-Most-3.pdf",  "caption": "",  "file_name": "Android-Studio-Shortcuts-You-Need-the-Most.pdf"}
Copy

You can find how to implement this content in Sample. Another example content you can craft:

JSON
    
 
{  "cards": [    {      "header": {        "title": "Pizza Bot Customer Support",        "subtitle": "pizzabot@example.com",        "imageUrl": "https://goo.gl/aeDtrS",        "imageStyle": "IMAGE"      },    ...    }  ]}
Copy

You can add extras before sending a message, by intercepting the object into a valid JSON object, for example:

JSON
    
 
{"key1":"value1","key2":"value2"}
Copy

Metadata is automatically synchronized by each participant in the Chat Room, it is important that the amount of data stored in metadata is kept to a minimum to ensure the quickest synchronization possible.

Send Custom Message

The custom message is the best option to create customized UI message needs by sending structured data, such as when you need to send location message, a concert ticket message, a product info, and others UI messages that need to be customized. You need to create message object first before sending it, for example:

Javascript
    
​x
 
const message = qiscus.generateCustomMessage({  roomId: 35249123,  // This text will goes into message.text  text: 'This is text',  // This is your desired custom type  type: 'custom-text',  // This is your desired custom type data  payload: {    customTextContent: 'something different',  },  // This is for extras data for the message it self, and  // should not relate to your custom message data  extras: {    key: 'value',    num: 1,  }})​// Then you can send the comment withqiscus.sendComment(  message.room_id,  message.message,  message.unique_id,  message.type,  message.payload,  message.extras,)
Copy

Where:

roomId (long): chat room id, you can get this id in chat room object
message (string): text that you send to other participant
type (string): your desired custom type
payload (JSON) : payload to define the structured message data. For example, you want to create your own file message
extras (JSON): This is for extras data for the message, and may not relate to your custom message data

Get Thumbnail URL

You can retrieve the media URL or the thumbnail URL, by following this code:

Dart
    
 
qiscus.getThumbnailURL(URL); // return thumbnail URL
Copy

Receive Message

When user successfully send a message, other participant receive the message through newMessageCallback event. You need to implement this event for getting this message, for example:

Javascript
    
 
qiscus.init({    AppId: 'QISCUS_SDK_APP_ID',    options: {        newMessagesCallback: function (messages) {         var message = messages[0]        // Do something with message    }    }})
Copy

Update Message Read Status

You can set your message status into read. The ideal case of this, is to notify other participants that a message has been read. You need to pass roomId and commentId.

When you have 10 messages, let's say it has message Ids from 1 to 10 and put 10 as the latest message Id. Once you set read message status with the latest message, in this case is 10, your previous messages which are 1 to 9 message Ids, will be updated into read and it will make your unread count become 0.

After succeed to send read status, other participants will receive a read event, for further details you can refer to Event Handler section.

You can update message read status by calling readComment() method, for example:

Javascript
    
 
qiscus.readComment(roomId, lastReadCommentId)
Copy

Update message read status only work on 1-on-1 Chat and Group Chat.

Load Message with Limit and Offset

You can get previous messages by calling loadComments() method, by default you get 20 messages start from your last_comment_id, and also you can use this for load more the older messages, for example

Javascript
    
 
var options = {   last_comment_id:10,   after:false,   limit:20}​qiscus.loadComments(roomId, options)    .then(function (comments) {        // On success    })    .catch(function (error) {        // On error    })
Copy

Where:

roomId: chat room id
options: an object with value of limit, after, and last comment id
limit: how many message you want to receive, by default is 20
last_comment_id: your starting pointer to receive message
after : set false to get previous messages from last_comment_id, set true to get next messages from last_comment_id

Upload File (% of Process)

You can send a raw file by passing file. In return you will URL and progress event, that you can use this listener to create your own uploading process UI, for example:

Javascript
    
 
qiscus.upload(file: File, function (error: Error, progress: ProgressEvent, url: String) {    if (error) {        // on Error    }    if (progress) {        // Do something when file are still uploading    }    if (url) {        // on Success    }})
Copy

Delete Message

You can delete a message by calling this deleteComments() method for example:

Javascript
    
 
qiscus.deleteComment(roomId, commentUniqueIds)    .then(function (comment) {        // On success    })    .catch(function (error) {        // On error    })
Copy

Where:

roomId: chat room id
commentUniqueIds: unique id of qiscus comment object

Clear All Messages in Particular Chat Room

You can clear all message by passing array roomUniqueIds this clear all messages only effect QiscusAccount side, other participants still remain. For example:

Javascript
    
 
qiscus.clearRoomMessages([roomUniqueIds])    .then(function (rooms) {        // On success    })    .catch(function (error) {        // On error    })
Copy

The maximum number of roomUniqueIds for an API call is 10. If you pass more than 10 roomUniqueIds it returns an error

Generate Message

Text

Javascript
    
 
var message = qiscus.generateMessage({  roomId: 123,  text: "Some text",  extras: { key: "value" },})
Copy

File Attachment

Javascript
    
 
var message = qiscus.generateFileAttachmentMessage({  roomId: 123,  text: 'Something',  url: 'https://via.placeholder.com/200',  filename: '200.jpg',  size: 200,  caption: 'Some caption',  extras: { key: 'value'}})
Copy

Custom

Javascript
    
 
var message = qiscus.generateCustomMessage({  roomId: 123,  text: 'Some text',  type: 'my-custom-type',  payload: { key: 'value' },  extras: { key: 'value' }})
Copy

Sending generated message

Javascript
    
 
qiscus.sendComment(    message.room_id,    message.message,    message.unique_id,    message.type,    message.payload,    message.extras)
Copy


roomId	(number) Which room does this message belong to
text	(string) A string which will shown to user (for message with "text" type)
extras	(json) A custom additional data for this specific message
url	(string) A URL to which the file attachment refer into (for message with "file attachment" type)
filename	(string) File filename (for message with "file attachment" type)
size	(number) File size in byte (for message with "file attachment" type)
caption	(string) A string which will be shown to user (for message with "file attachment" type)
payload	(json) A custom data to represent your custom message (for message with "custom" type)

Last updated on

Was this page helpful?