Chat·续3

<label for="file">Edit file:</label>
<input type="file" id="file" name="file" />
<button onclick="onEditFile()">Edit File</button>

async function onEditFile() {
    const messageId = "...";
    const file = document.getElementById("file");
    await meeting.chat.editFileMessage(messageId, file.files[0]);
}

Editing a file is similar to editing an image. To edit a file, use meeting.chat.editFileMessage().

import { useRef } from "react";

function ChatComponent() {
    const fileInputRef = useRef(null);

const onEditFile = async () => {
        const messageId = "...";
        const file = fileInputRef.current;
        if (file && file.files[0]) {
            await meeting.chat.editFileMessage(messageId, file.files[0]);
        }
    };

return (
        <>
            <label htmlFor="file">Edit file:</label>
            <input type="file" id="file" name="file" ref={fileInputRef} />
            <button onClick={onEditFile}>Edit File</button>
        </>
    );
}

Editing a file is similar to editing an image. To edit a file, use meeting.chat.editFileMessage().

import DocumentPicker from "@react-native-documents/picker";

async function onEditFile() {
    const messageId = "...";
    // Get the file uri and create an object with the following fields
    const res = await DocumentPicker.pickSingle({
        type: [DocumentPicker.types.allFiles],
    });
    const file = {
        uri: res.uri,
        name: res.name,
        size: res.size,
        type: res.type,
    };
    await meeting.chat.editFileMessage(messageId, file);
}

Edit Any Message Type

There is also a common method called meeting.chat.editMessage() that can be used to edit text, image, and file messages. It calls one of the methods above depending on the type of the payload you send. The editMessage() method accepts parameters messageId and message of the following type:

async function editMessage(
    messageId: string,
    message:
        | { type: "text"; message: string }
        | { type: "image"; image: File }
        | { type: "file"; file: File },
): Promise<void>;

Here is how you would use the editMessage() method to edit a text message:

const messageId = "...";
const message = "Is this just fantasy?";
await meeting.chat.editMessage(messageId, { type: "text", message });

There is also a common method called meeting.chat.editMessage() that can be used to edit text, image, and file messages. It calls one of the methods above depending on the type of the payload you send. The editMessage() method accepts parameters messageId and message of the following type:

async function editMessage(
    messageId: string,
    message:
        | { type: "text"; message: string }
        | { type: "image"; image: File }
        | { type: "file"; file: File },
): Promise<void>;

Here is how you would use the editMessage() method to edit a text message:

const messageId = "...";
const message = "Is this just fantasy?";
await meeting.chat.editMessage(messageId, { type: "text", message });

There is also a common method called meeting.chat.editMessage() that can be used to edit text, image, and file messages. It calls one of the methods above depending on the type of the payload you send. The editMessage() method accepts parameters messageId and message of the following type:

async function editMessage(
    messageId: string,
    message:
        | { type: "text"; message: string }
        | { type: "image"; image: File }
        | { type: "file"; file: File },
): Promise<void>;

Here is how you would use the editMessage() method to edit a text message:

const messageId = "...";
const message = "Is this just fantasy?";
await meeting.chat.editMessage(messageId, { type: "text", message });

Other Chat Functions

Pinning a Chat Message

You can pin a number of messages to the chat. When you pin a message, the message object will have the attribute pinned: true, using which you can identify if a message is pinned.

To pin a message, pass its ID to meeting.chat.pin(). The local participant must have joined the meeting, otherwise the method throws an error.

const messageId = "...";
await meeting.chat.pin(messageId);

To get the list of pinned messages, use meeting.chat.fetchPinnedMessages().

You can also unpin a pinned message by using the meeting.chat.unpin() method.

// Unpin the most recently pinned message.
const [latestPinned] = await meeting.chat.fetchPinnedMessages({
    limit: 1,
    direction: "before",
});
await meeting.chat.unpin(latestPinned.id);

You can listen for events to know when a message is pinned or unpinned.

meeting.chat.on("pinMessage", ({ message }) => {
    console.log("A message was pinned", JSON.stringify(message));
});

meeting.chat.on("unpinMessage", ({ message }) => {
    console.log("A message was unpinned", JSON.stringify(message));
});

You can pin a number of messages to the chat. When you pin a message, the message object will have the attribute pinned: true, using which you can identify if a message is pinned.

To pin a message, pass its ID to meeting.chat.pin(). The local participant must have joined the meeting, otherwise the method throws an error.

const messageId = "...";
await meeting.chat.pin(messageId);

To get the list of pinned messages, use meeting.chat.fetchPinnedMessages().

You can also unpin a pinned message by using the meeting.chat.unpin() method.

// Unpin the most recently pinned message.
const [latestPinned] = await meeting.chat.fetchPinnedMessages({
    limit: 1,
    direction: "before",
});
await meeting.chat.unpin(latestPinned.id);

You can listen for events to know when a message is pinned or unpinned.

meeting.chat.on("pinMessage", ({ message }) => {
    console.log("A message was pinned", JSON.stringify(message));
});

meeting.chat.on("unpinMessage", ({ message }) => {
    console.log("A message was unpinned", JSON.stringify(message));
});

You can pin a number of messages to the chat. When you pin a message, the message object will have the attribute pinned: true, using which you can identify if a message is pinned.

To pin a message, pass its ID to meeting.chat.pin(). The local participant must have joined the meeting, otherwise the method throws an error.

const messageId = "...";
await meeting.chat.pin(messageId);

To get the list of pinned messages, use meeting.chat.fetchPinnedMessages().

You can also unpin a pinned message by using the meeting.chat.unpin() method.

// Unpin the most recently pinned message.
const [latestPinned] = await meeting.chat.fetchPinnedMessages({
    limit: 1,
    direction: "before",
});
await meeting.chat.unpin(latestPinned.id);

You can listen for events to know when a message is pinned or unpinned.

meeting.chat.on("pinMessage", ({ message }) => {
    console.log("A message was pinned", JSON.stringify(message));
});

meeting.chat.on("unpinMessage", ({ message }) => {
    console.log("A message was unpinned", JSON.stringify(message));
});

Deleting a Chat Message

The meeting.chat namespace exposes a method called deleteMessage(). It takes a parameter messageId of type string.

const messageId = "...";
await meeting.chat.deleteMessage(messageId);

When a message is deleted, participants receive a chatUpdate event with action set to delete.

The meeting.chat namespace exposes a method called deleteMessage(). It takes a parameter messageId of type string.

const messageId = "...";
await meeting.chat.deleteMessage(messageId);

When a message is deleted, participants receive a chatUpdate event with action set to delete.

The meeting.chat namespace exposes a method called deleteMessage(). It takes a parameter messageId of type string.

const messageId = "...";
await meeting.chat.deleteMessage(messageId);

When a message is deleted, participants receive a chatUpdate event with action set to delete.

Export chat messages

You can programmatically retrieve all chat messages of a RealtimeKit session in the following ways:

  • Using the Chat Replay API
  • Setting up webhook for the meeting.chatSynced event

Get chat download URL

To get the chat download URL, make an HTTP GET request to the Chat Replay API endpoint. The API returns:

{
    "success": true,
    "data": {
        "chat_download_url": "string",
        "chat_download_url_expiry": "string"
    }
}
  • chat_download_url - A URL that allows you to download the entire chat dump of a session in CSV format from AWS S3
  • chat_download_url_expiry - The expiry timestamp of the chat_download_url. If the URL expires, call this endpoint again to obtain a new download URL

For details on the Chat Replay API endpoint, refer to the Realtime Kit API documentation.

Download the chat dump file

You can download the chat dump file in CSV format by making an HTTP GET request to the chat_download_url obtained in the previous step.

The process of downloading a file from an HTTP URL differs based on whether you are downloading on the client side or server side.

Download on the client

To download at client side:

  1. Make a GET request to the chat_download_url
  2. Convert the response to a blob
  3. Create an invisible <a> HTML element with a download attribute and add the blob to its href
  4. Programmatically click on the <a> element so that the browser automatically starts downloading, then remove the <a> element

Download on the server

To download on the server using Node.js streams:

  1. Create a writable stream for a local file
  2. Make a GET request to chat_download_url
  3. Get a readable stream using res.body and pipe to the writable stream created in the first step

CSV chat dump format

The CSV file contains all chat messages along with participant information and metadata. It includes the following column headings:

  • id - Unique chat message ID
  • participantId - ID of the participant who sent the message
  • sessionId - The session ID from which the chat message was sent
  • meetingId - The ID of the meeting to which this session belongs
  • displayName - Display name of the participant who sent this message
  • pinned - A boolean that indicates if the current message was pinned
  • isEdited - A boolean that indicates if the current message was edited
  • payloadType - An ENUM that indicates the type of payload sent in the chat message. It can be one of TEXT_MESSAGE, IMAGE_MESSAGE, FILE_MESSAGE
  • payload - The actual payload sent in the chat message
  • createdAt - Timestamp when this chat message was sent

Was this helpful?

YesNo

On this page

Chat·续3 - 图1Docs

{"@context":"https://schema.org","@type":"WebPage","@id":"https://developers.cloudflare.com/realtime/realtimekit/humans/core/chat/#page","headline":"Chat","description":"Send and receive chat messages in RealtimeKit meetings using the Core SDK.","url":"https://developers.cloudflare.com/realtime/realtimekit/humans/core/chat/","inLanguage":"en","image":"https://developers.cloudflare.com/realtime/realtimekit/humans/core/chat/og.png?v=a81cc23312bdf906","dateModified":"2026-10-19","publisher":{"@type":"Organization","name":"Cloudflare","description":"One platform for your apps, agents, and workforce. Build, secure, and scale without managing infrastructure","url":"https://www.cloudflare.com/","sameAs":["https://github.com/cloudflare","https://www.linkedin.com/company/cloudflare","https://x.com/cloudflare"],"logo":{"@type":"ImageObject","url":"https://developers.cloudflare.com/logo.svg"},"address":{"@type":"PostalAddress","streetAddress":"101 Townsend St","addressLocality":"San Francisco","addressRegion":"CA","postalCode":"94107","addressCountry":"US"},"contactPoint":[{"@type":"ContactPoint","contactType":"Customer Support","url":"https://support.cloudflare.com/","availableLanguage":["English"]},{"@type":"ContactPoint","contactType":"Sales","url":"https://www.cloudflare.com/contact/","availableLanguage":["English"]}]},"isPartOf":{"@type":"WebSite","@id":"https://developers.cloudflare.com/#website","name":"Cloudflare Docs","url":"https://developers.cloudflare.com/"}}

description: Detect and display active speakers in RealtimeKit meetings using the Core SDK. title: Display active speakers image: https://developers.cloudflare.com/realtime/realtimekit/humans/core/display-active-speakers/og.png?v=b094da7e86dcd500

Skip to content

Documentation Index
Fetch the complete documentation index at: https://developers.cloudflare.com/realtime/llms.txt
Use this file to discover all available pages before exploring further.