> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-audit-mechanical-fixes.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Delivery & Read Receipts

> Mark messages as delivered or read and handle receipts with the CometChat JavaScript SDK.

## Mark Messages as Delivered

*In other words, as a recipient, how do I inform the sender that I've received a message?*

You can mark the messages for a particular conversation as read using the `markAsDelivered()` method. This method takes the below parameters as input:

| Parameter      | Information                                                                                                                                                                         |
| -------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `messageId`    | The ID of the message above which all the messages for a particular conversation are to be marked as read.                                                                          |
| `receiverId`   | In case of one to one conversation message's sender `UID` will be the receipt's receiver Id. In case of group conversation message's receiver Id will be the receipt's receiver Id. |
| `receiverType` | Type of the receiver. Could be either of the two values( user or group).                                                                                                            |
| `senderId`     | The `UID` of the sender of the message.                                                                                                                                             |

Messages for both user & group conversations can be marked as read using this method.

Ideally, you would like to mark all the messages as delivered for any conversation when the user opens the chat window for that conversation. This includes two scenarios:

1. **When the list of messages for the conversation is fetched**: In this case you need to obtain the last message in the list of messages and pass the message ID of that message to the markAsDelivered() method.
2. **When the user is on the chat window and a real-time message is received:** In this case you need to obtain the message ID of the message and pass it to the markAsDelivered() method.

<Tabs>
  <Tab title="User">
    ```javascript theme={null}
    // Mark as delivered/read (pass message object)
    CometChat.markAsDelivered(message);
    CometChat.markAsRead(message);

    // Mark entire conversation
    CometChat.markConversationAsRead("UID", "user");

    // Listen for receipt events
    CometChat.addMessageListener("LISTENER_ID", new CometChat.MessageListener({
    onMessagesDelivered: (receipt) => { },
    onMessagesRead: (receipt) => { },
    onMessagesDeliveredToAll: (receipt) => { }, // Groups only
    onMessagesReadByAll: (receipt) => { } // Groups only
    }));

    ```
  </Tab>
</Tabs>

Delivery and read receipts track whether messages have been delivered to and read by recipients.

## Mark as Delivered

Use `markAsDelivered()` to mark messages as delivered. You can pass either a message object or individual parameters.

### Using Message Object

<Tabs>
  <Tab title="TypeScript">
    ```typescript theme={null}
    CometChat.markAsDelivered(message).then(
      () => {
        console.log("Marked as delivered successfully");
      },
      (error: CometChat.CometChatException) => {
        console.log("Error marking as delivered:", error);
      }
    );
    ```
  </Tab>

  <Tab title="JavaScript">
    ```javascript theme={null}
    CometChat.markAsDelivered(message).then(
      () => {
        console.log("Marked as delivered successfully");
      },
      (error) => {
        console.log("Error marking as delivered:", error);
      }
    );
    ```
  </Tab>
</Tabs>

### Using Parameters

| Parameter      | Description                                          |
| -------------- | ---------------------------------------------------- |
| `messageId`    | ID of the message to mark as delivered               |
| `receiverId`   | For user chats: sender's UID. For groups: group GUID |
| `receiverType` | `"user"` or `"group"`                                |
| `senderId`     | UID of the message sender                            |

<Tabs>
  <Tab title="TypeScript (User)">
    ```typescript theme={null}
    let messageId: string = "MESSAGE_ID";
    let receiverId: string = "MESSAGE_SENDER_UID";
    let receiverType: string = "user";
    let senderId: string = "MESSAGE_SENDER_UID";

    CometChat.markAsDelivered(messageId, receiverId, receiverType, senderId).then(
    () => {
    console.log("Marked as delivered successfully");
    },
    (error: CometChat.CometChatException) => {
    console.log("Error marking as delivered:", error);
    }
    );

    ```
  </Tab>

  <Tab title="JavaScript (User)">
    ```javascript theme={null}
    let messageId = "MESSAGE_ID";
    let receiverId = "MESSAGE_SENDER_UID";
    let receiverType = "user";
    let senderId = "MESSAGE_SENDER_UID";

    CometChat.markAsDelivered(messageId, receiverId, receiverType, senderId).then(
      () => {
        console.log("Marked as delivered successfully");
      },
      (error) => {
        console.log("Error marking as delivered:", error);
      }
    );
    ```
  </Tab>

  <Tab title="TypeScript (Group)">
    ```typescript theme={null}
    let messageId: string = "MESSAGE_ID";
    let receiverId: string = "GROUP_GUID";
    let receiverType: string = "group";
    let senderId: string = "MESSAGE_SENDER_UID";

    CometChat.markAsDelivered(messageId, receiverId, receiverType, senderId).then(
    () => {
    console.log("Marked as delivered successfully");
    },
    (error: CometChat.CometChatException) => {
    console.log("Error marking as delivered:", error);
    }
    );

    ```
  </Tab>

  <Tab title="JavaScript (Group)">
    ```javascript theme={null}
    let messageId = "MESSAGE_ID";
    let receiverId = "GROUP_GUID";
    let receiverType = "group";
    let senderId = "MESSAGE_SENDER_UID";

    CometChat.markAsDelivered(messageId, receiverId, receiverType, senderId).then(
      () => {
        console.log("Marked as delivered successfully");
      },
      (error) => {
        console.log("Error marking as delivered:", error);
      }
    );
    ```
  </Tab>
</Tabs>

## Mark Conversation as Delivered

Use `markConversationAsDelivered()` to mark all messages in a conversation as delivered.

`markConversationAsDelivered()` resolves with a `string` on success.

<Tabs>
  <Tab title="TypeScript (User)">
    ```typescript theme={null}
    let conversationWith: string = "USER_UID";
    let conversationType: string = "user";

    CometChat.markConversationAsDelivered(conversationWith, conversationType).then(
    (response: string) => {
    console.log("Conversation marked as delivered", response);
    },
    (error: CometChat.CometChatException) => {
    console.log("Error:", error);
    }
    );

    ```
  </Tab>

  <Tab title="JavaScript (User)">
    ```javascript theme={null}
    let conversationWith = "USER_UID";
    let conversationType = "user";

    CometChat.markConversationAsDelivered(conversationWith, conversationType).then(
      (response) => {
        console.log("Conversation marked as delivered", response);
      },
      (error) => {
        console.log("Error:", error);
      }
    );
    ```
  </Tab>

  <Tab title="TypeScript (Group)">
    ```typescript theme={null}
    let conversationWith: string = "GROUP_GUID";
    let conversationType: string = "group";

    CometChat.markConversationAsDelivered(conversationWith, conversationType).then(
    (response: string) => {
    console.log("Conversation marked as delivered", response);
    },
    (error: CometChat.CometChatException) => {
    console.log("Error:", error);
    }
    );

    ```
  </Tab>

  <Tab title="JavaScript (Group)">
    ```javascript theme={null}
    let conversationWith = "GROUP_GUID";
    let conversationType = "group";

    CometChat.markConversationAsDelivered(conversationWith, conversationType).then(
      (response) => {
        console.log("Conversation marked as delivered", response);
      },
      (error) => {
        console.log("Error:", error);
      }
    );
    ```
  </Tab>
</Tabs>

## Mark as Read

Use `markAsRead()` to mark messages as read. You can pass either a message object or individual parameters.

### Using Message Object

<Tabs>
  <Tab title="TypeScript">
    ```typescript theme={null}
    CometChat.markAsRead(message).then(
      () => {
        console.log("Marked as read successfully");
      },
      (error: CometChat.CometChatException) => {
        console.log("Error marking as read:", error);
      }
    );
    ```
  </Tab>

  <Tab title="JavaScript">
    ```javascript theme={null}
    CometChat.markAsRead(message).then(
      () => {
        console.log("Marked as read successfully");
      },
      (error) => {
        console.log("Error marking as read:", error);
      }
    );
    ```
  </Tab>
</Tabs>

### Using Parameters

<Tabs>
  <Tab title="TypeScript (User)">
    ```typescript theme={null}
    let messageId: string = "MESSAGE_ID";
    let receiverId: string = "MESSAGE_SENDER_UID";
    let receiverType: string = "user";
    let senderId: string = "MESSAGE_SENDER_UID";

    CometChat.markAsRead(messageId, receiverId, receiverType, senderId).then(
    () => {
    console.log("Marked as read successfully");
    },
    (error: CometChat.CometChatException) => {
    console.log("Error marking as read:", error);
    }
    );

    ```
  </Tab>

  <Tab title="JavaScript (User)">
    ```javascript theme={null}
    let messageId = "MESSAGE_ID";
    let receiverId = "MESSAGE_SENDER_UID";
    let receiverType = "user";
    let senderId = "MESSAGE_SENDER_UID";

    CometChat.markAsRead(messageId, receiverId, receiverType, senderId).then(
      () => {
        console.log("Marked as read successfully");
      },
      (error) => {
        console.log("Error marking as read:", error);
      }
    );
    ```
  </Tab>

  <Tab title="TypeScript (Group)">
    ```typescript theme={null}
    let messageId: string = "MESSAGE_ID";
    let receiverId: string = "GROUP_GUID";
    let receiverType: string = "group";
    let senderId: string = "MESSAGE_SENDER_UID";

    CometChat.markAsRead(messageId, receiverId, receiverType, senderId).then(
    () => {
    console.log("Marked as read successfully");
    },
    (error: CometChat.CometChatException) => {
    console.log("Error marking as read:", error);
    }
    );

    ```
  </Tab>

  <Tab title="JavaScript (Group)">
    ```javascript theme={null}
    let messageId = "MESSAGE_ID";
    let receiverId = "GROUP_GUID";
    let receiverType = "group";
    let senderId = "MESSAGE_SENDER_UID";

    CometChat.markAsRead(messageId, receiverId, receiverType, senderId).then(
      () => {
        console.log("Marked as read successfully");
      },
      (error) => {
        console.log("Error marking as read:", error);
      }
    );
    ```
  </Tab>
</Tabs>

## Mark Conversation as Read

Use `markConversationAsRead()` to mark all messages in a conversation as read.

<Tabs>
  <Tab title="TypeScript (User)">
    ```typescript theme={null}
    let conversationWith: string = "USER_UID";
    let conversationType: string = "user";

    CometChat.markConversationAsRead(conversationWith, conversationType).then(
    (response: string) => {
    console.log("Conversation marked as read", response);
    },
    (error: CometChat.CometChatException) => {
    console.log("Error:", error);
    }
    );

    ```
  </Tab>

  <Tab title="JavaScript (User)">
    ```javascript theme={null}
    let conversationWith = "USER_UID";
    let conversationType = "user";

    CometChat.markConversationAsRead(conversationWith, conversationType).then(
      (response) => {
        console.log("Conversation marked as read", response);
      },
      (error) => {
        console.log("Error:", error);
      }
    );
    ```
  </Tab>

  <Tab title="TypeScript (Group)">
    ```typescript theme={null}
    let conversationWith: string = "GROUP_GUID";
    let conversationType: string = "group";

    CometChat.markConversationAsRead(conversationWith, conversationType).then(
    (response: string) => {
    console.log("Conversation marked as read", response);
    },
    (error: CometChat.CometChatException) => {
    console.log("Error:", error);
    }
    );

    ```
  </Tab>

  <Tab title="JavaScript (Group)">
    ```javascript theme={null}
    let conversationWith = "GROUP_GUID";
    let conversationType = "group";

    CometChat.markConversationAsRead(conversationWith, conversationType).then(
      (response) => {
        console.log("Conversation marked as read", response);
      },
      (error) => {
        console.log("Error:", error);
      }
    );
    ```
  </Tab>
</Tabs>

## Real-Time Receipt Events

Register a `MessageListener` to receive delivery and read receipt events.

| Callback                   | Description                            |
| -------------------------- | -------------------------------------- |
| `onMessagesDelivered`      | Message delivered to a user            |
| `onMessagesRead`           | Message read by a user                 |
| `onMessagesDeliveredToAll` | Group message delivered to all members |
| `onMessagesReadByAll`      | Group message read by all members      |

<Tabs>
  <Tab title="TypeScript">
    ```typescript theme={null}
    let listenerID: string = "UNIQUE_LISTENER_ID";

    CometChat.addMessageListener(
    listenerID,
    new CometChat.MessageListener({
    onMessagesDelivered: (messageReceipt: CometChat.MessageReceipt) => {
    console.log("Message delivered:", messageReceipt);
    },
    onMessagesRead: (messageReceipt: CometChat.MessageReceipt) => {
    console.log("Message read:", messageReceipt);
    },
    onMessagesDeliveredToAll: (messageReceipt: CometChat.MessageReceipt) => {
    console.log("Message delivered to all group members:", messageReceipt);
    },
    onMessagesReadByAll: (messageReceipt: CometChat.MessageReceipt) => {
    console.log("Message read by all group members:", messageReceipt);
    }
    })
    );

    ```
  </Tab>

  <Tab title="JavaScript">
    ```javascript theme={null}
    let listenerID = "UNIQUE_LISTENER_ID";

    CometChat.addMessageListener(
     listenerID,
     new CometChat.MessageListener({
     onMessagesDelivered: (messageReceipt) => {
     console.log("Message delivered:", messageReceipt);
     },
     onMessagesRead: (messageReceipt) => {
     console.log("Message read:", messageReceipt);
     },
     onMessagesDeliveredToAll: (messageReceipt) => {
     console.log("Message delivered to all group members:", messageReceipt);
     },
     onMessagesReadByAll: (messageReceipt) => {
     console.log("Message read by all group members:", messageReceipt);
     }
     })
    );
    ```
  </Tab>
</Tabs>

You will receive events in the form of [`MessageReceipt`](/sdk/reference/auxiliary#messagereceipt) objects. The message receipt contains the below parameters:

| Parameter      | Information                                                                                                                               |
| -------------- | ----------------------------------------------------------------------------------------------------------------------------------------- |
| `messageId`    | The Id of the message prior to which all the messages for that particular conversation have been marked as read.                          |
| `sender`       | User object containing the details of the user who has marked the message as read. System User for `deliveredToAll` & `readByAll` events. |
| `receiverId`   | Id of the receiver whose conversation has been marked as read.                                                                            |
| `receiverType` | type of the receiver (user/group)                                                                                                         |
| `receiptType`  | Type of the receipt (read/delivered)                                                                                                      |
| `deliveredAt`  | The timestamp of the time when the message was delivered. This will only be present if the receiptType is delivered.                      |
| `readAt`       | The timestamp of the time when the message was read. This will only be present when the receiptType is read.                              |

The `markAsDelivered()` and `markAsRead()` methods are fire-and-forget — they do not return a [`MessageReceipt`](/sdk/reference/auxiliary#messagereceipt) object. Use the listener callbacks above to receive delivery and read confirmations.

You will receive a list of [`MessageReceipt`](/sdk/reference/auxiliary#messagereceipt) objects.

<Info>
  The following features will be available only if the **Enhanced Messaging Status** feature is enabled for your app.

  * `onMessagesDeliveredToAll` event,
  * `onMessagesReadByAll` event,
  * `deliveredAt` field in a group message,
  * `readAt` field in a group message.
  * `markMessageAsUnread` method.
</Info>

<Warning>
  Always remove listeners when no longer needed to prevent memory leaks.

  ```javascript theme={null}
  CometChat.removeMessageListener("UNIQUE_LISTENER_ID");
  ```
</Warning>

### MessageReceipt Object

The listener callbacks receive a [`MessageReceipt`](/sdk/reference/auxiliary#messagereceipt) object:

| Field        | Getter              | Return Type                            | Description                    |
| ------------ | ------------------- | -------------------------------------- | ------------------------------ |
| messageId    | `getMessageId()`    | `string`                               | ID of the message              |
| sender       | `getSender()`       | [`User`](/sdk/reference/entities#user) | User who triggered the receipt |
| receiverId   | `getReceiverId()`   | `string`                               | ID of the receiver             |
| receiverType | `getReceiverType()` | `string`                               | `"user"` or `"group"`          |
| receiptType  | `getReceiptType()`  | `string`                               | `"delivery"` or `"read"`       |
| deliveredAt  | `getDeliveredAt()`  | `number`                               | Timestamp when delivered       |
| readAt       | `getReadAt()`       | `number`                               | Timestamp when read            |

## Get Receipt History

Use `getMessageReceipts()` to fetch delivery and read receipts for a specific message. Useful for group messages to see which members have received/read the message.

<Tabs>
  <Tab title="TypeScript">
    ```typescript theme={null}
    let messageId: number = 123;

    CometChat.getMessageReceipts(messageId).then(
    (receipts: CometChat.MessageReceipt[]) => {
    console.log("Message receipts:", receipts);
    },
    (error: CometChat.CometChatException) => {
    console.log("Error fetching receipts:", error);
    }
    );

    ```
  </Tab>

  <Tab title="JavaScript">
    ```javascript theme={null}
    let messageId = 123;

    CometChat.getMessageReceipts(messageId).then(
      (receipts) => {
        console.log("Message receipts:", receipts);
      },
      (error) => {
        console.log("Error fetching receipts:", error);
      }
    );
    ```
  </Tab>
</Tabs>

Returns an array of [`MessageReceipt`](/sdk/reference/auxiliary#messagereceipt) objects.

## Missed Receipts

When fetching messages, each message object includes `deliveredAt` and `readAt` timestamps indicating when the message was delivered and read.

```javascript theme={null}
let deliveredAt = message.getDeliveredAt();
let readAt = message.getReadAt();
```

<Note>
  The following features require **Enhanced Messaging Status** to be enabled for
  your app: - `onMessagesDeliveredToAll` event - `onMessagesReadByAll` event -
  `deliveredAt` field in group messages - `readAt` field in group messages -
  `markMessageAsUnread()` method
</Note>

## Mark as Unread

Use `markAsUnread()` to mark a message as unread. This is useful for "mark as unread" functionality in conversation lists. Pass a message object ([`TextMessage`](/sdk/reference/messages#textmessage), [`MediaMessage`](/sdk/reference/messages#mediamessage), or [`CustomMessage`](/sdk/reference/messages#custommessage)).

<Tabs>
  <Tab title="TypeScript">
    ```typescript theme={null}
    CometChat.markAsUnread(message).then(
      (response: string) => {
        console.log("Message marked as unread:", response);
      },
      (error: CometChat.CometChatException) => {
        console.log("Error marking as unread:", error);
      }
    );
    ```
  </Tab>

  <Tab title="JavaScript">
    ```javascript theme={null}
    CometChat.markAsUnread(message).then(
      (response) => {
        console.log("Message marked as unread:", response);
      },
      (error) => {
        console.log("Error marking as unread:", error);
      }
    );
    ```
  </Tab>
</Tabs>

| Parameter | Type                                                 | Description                          |
| --------- | ---------------------------------------------------- | ------------------------------------ |
| `message` | [`BaseMessage`](/sdk/reference/messages#basemessage) | The message object to mark as unread |

***

## Next Steps

<CardGroup cols={2}>
  <Card title="Typing Indicators" icon="keyboard" href="/sdk/javascript/typing-indicators">
    Show real-time typing status in conversations
  </Card>

  <Card title="Receive Messages" icon="envelope-open" href="/sdk/javascript/receive-message">
    Listen for incoming messages in real time
  </Card>

  <Card title="Retrieve Conversations" icon="comments" href="/sdk/javascript/retrieve-conversations">
    Fetch conversation list with unread counts
  </Card>

  <Card title="All Real-Time Listeners" icon="tower-broadcast" href="/sdk/javascript/all-real-time-listeners">
    Complete reference for all SDK event listeners
  </Card>
</CardGroup>