@lunionlab/meet-react-native

SDK React Native (Expo) de lunion.meet : ajoutez des appels audio et vidéo temps réel à votre app mobile. Même hook que sur le web (useLunionRoom), mais construit sur react-native-webrtc.

Comme partout, le jeton est émis côté serveur (@lunionlab/meet-server-sdk) ; l'app mobile rejoint la salle avec access.url + access.token.

Installation

npx expo install @lunionlab/meet-react-native react-native-webrtc

1.0.0 : le SDK repose sur react-native-webrtc en RTCPeerConnection standard (l'API du hook useLunionRoom est inchangée).

react-native-webrtc contient du code natif : utilisez un development build Expo (npx expo prebuild puis npx expo run:ios / run:android). Il ne fonctionne pas dans Expo Go.

Permissions

Avec le plugin config dans app.json :

{
  "expo": {
    "plugins": [
      ["react-native-webrtc", {
        "cameraPermission": "Pour les appels vidéo",
        "microphonePermission": "Pour les appels audio"
      }]
    ]
  }
}

Utilisation

import { View } from "react-native";
import { useLunionRoom, VideoTrack } from "@lunionlab/meet-react-native";

export function CallScreen({ url, room, token }: { url: string; room: string; token: string }) {
  const { localStream, participants, toggleMic, toggleCamera, leave } = useLunionRoom({
    sfuUrl: url, // access.url
    room,        // access.room
    name: "Awa",
    token,       // access.token
  });

  return (
    <View style={{ flex: 1, flexDirection: "row", flexWrap: "wrap" }}>
      <VideoTrack stream={localStream} mirror style={{ width: "50%", aspectRatio: 3 / 4 }} />
      {participants.map((p) => (
        <VideoTrack key={p.id} stream={p.stream} style={{ width: "50%", aspectRatio: 3 / 4 }} />
      ))}
    </View>
  );
}

Récupérer un jeton (côté serveur, Node)

import { RoomServiceClient } from "@lunionlab/meet-server-sdk";

const rooms = new RoomServiceClient("https://meet.lunion-lab.com/api/v1", process.env.LUNION_API_KEY!);
const room = await rooms.createRoom("Réunion produit");
const access = await rooms.createToken(room.slug, "user-42", { name: "Awa" });
// → renvoyez access.url, access.room, access.token à votre app mobile

API

| Élément | Rôle | |---|---| | useLunionRoom(options) | Connexion, caméra/micro, participants. Retourne localStream, participants, status, toggleMic, toggleCamera, switchCamera, leave. | | VideoTrack | Affiche un MediaStream (basé sur RTCView). | | ensureWebrtcGlobals() | Enregistre les globals WebRTC (appelé automatiquement par le hook). |

Notes

• Repose sur react-native-webrtc en RTCPeerConnection standard (offer/answer sur /ws) : même protocole que le web et Flutter.
• À compiler dans un projet Expo/React Native réel (modules natifs requis).