how to send data from the livekit agent code to th...
# ask-ai
m
how to send data from the livekit agent code to the mobile client? Also how to receive that data on the client side. I'm using python for my agent code and react native for mobile client
t
Thanks for reaching out, Austin. I'm an AI assistant and I'm here to help. Give me a moment while I research this topic.
I'm glad you're exploring how to send data from your Python-based LiveKit agent to a React Native mobile client! You can achieve this smoothly using LiveKit's real-time data communication features like Remote Procedure Calls (RPCs) or data messages. Let me walk you through it step-by-step. 1. Sending Data from the Agent (Python):
Copy code
await ctx.room.local_participant.perform_rpc(
    destination_identity=client_participant.identity,
    method="nutrition.update",
    payload=json.dumps({
        'foods': foods,
        'totals': totals,
        'date': today_start.date().isoformat()
    })
)
This code sends a JSON payload to the client under the method name "nutrition.update". It’s a neat way to keep your client updated in real-time. 2. Receiving Data on the Client (React Native):
Copy code
const { send } = useDataChannel((dataMessage: ReceivedDataMessage<string>) => {
  let decoder = new TextDecoder('utf-8');
  let message = decoder.decode(dataMessage.payload);
  let title = 'Received Message';
  if (dataMessage.from != null) {
    title = 'Received Message from ' + dataMessage.from?.identity;
  }
  Toast.show({
    type: 'success',
    text1: title,
    text2: message,
  });
});
Here, your client listens for incoming data messages and shows them in a toast notification—making sure you never miss an update. 3. Optional: Sending Data via Backend:
Copy code
await roomService.sendData(roomName, new Uint8Array(data), kind, options);
This is another way to send data to all participants in the room, which might come in handy depending on your use case. To get you started, I recommend checking out these helpful starter projects: • Agent Starter (Python)Mobile Starter (React Native) Just a quick tip—make sure both your agent and client are connected to the same LiveKit room and properly authenticated. If you run into any bumps or have more questions, I’m here to help. Don’t hesitate to reach out! Sources: React Native quickstart | LiveKit Docs | Web and mobile frontends | LiveKit Docs | Expo quickstart | LiveKit Docs | complex-agents/nova-sonic/form_agent.py | example/src/RoomPage.tsx
m
how to receive the data on the client side?
t
To help you receive data on the client side in your React Native application, you can use LiveKit's
useDataChannel
hook to listen for incoming messages. Here's a friendly example to guide you:
Copy code
const { send } = useDataChannel((dataMessage: ReceivedDataMessage<string>) => {
  let decoder = new TextDecoder('utf-8');
  let message = decoder.decode(dataMessage.payload);
  let title = 'Received Message';
  if (dataMessage.from != null) {
    title = 'Received Message from ' + dataMessage.from?.identity;
  }
  Toast.show({
    type: 'success',
    text1: title,
    text2: message,
  });
});
This snippet listens for incoming data messages and decodes the payload so you can process or display the message as you like. Just make sure your React Native app is connected to the same LiveKit room as the sender and that the data channel is set up correctly. If anything feels unclear or you’d like me to walk you through it step-by-step, please don’t hesitate to ask—I’m here to help!