Сбор ледовых кандидатов не производится, peerConnection.iceGatheringState сразу же возвращает «завершено»

Question

Я застрял на этом некоторое время. Мой код основан на https://webrtc.org/getting-started/firebase-rtc-codelab. Я просто изменил его на React и базу данных реального времени firebase вместо firestore.

const VideoRoom = () => {
  const config = {
    apiKey: xxx,
    authDomain: xxx,
    databaseURL: xxx,
    projectId: xxx,
    storageBucket: xxx,
    messagingSenderId: xxx,
    appId: xxx,
  };

  const rtcconfig = {
    iceServers: [
      {
        urls: [
          "stun:stun1.l.google.com:19302",
          "stun:stun2.l.google.com:19302",
        ],
      },
    ],
    iceCandidatePoolSize: 10,
  };

  const { roomId } = useParams();

  if (!firebase.apps.length) {
    firebase.initializeApp(config);
  }

  const db = firebase.database();
  const rooms = () => db.ref("rooms");
  const room = (roomId) => db.ref(`rooms/${roomId}`);
  const callerCandidates = (roomId) =>
    db.ref(`rooms/${roomId}/callerCandidates`);
  const calleeCandidates = (roomId) =>
    db.ref(`rooms/${roomId}/calleeCandidates`);

  const peerConnection = new RTCPeerConnection(rtcconfig);
  var localStream = new MediaStream();
  var remoteStream = null;

  var localVideo = useRef(null);
  var remoteVideo = useRef(null);

  room(roomId)
    .once("value")
    .then((snapshot) => {
      if (!snapshot.val()) {
        createRoom();
        return;
      }
      joinRoomById(roomId, snapshot.val());
    });

  useEffect(() => {
    peerConnection.addEventListener("icegatheringstatechange", () => {
      console.log(
        `ICE gathering state changed: ${peerConnection.iceGatheringState}`
      );
    });

    peerConnection.addEventListener("connectionstatechange", () => {
      console.log(`Connection state change: ${peerConnection.connectionState}`);
    });

    peerConnection.addEventListener("signalingstatechange", () => {
      console.log(`Signaling state change: ${peerConnection.signalingState}`);
    });

    peerConnection.addEventListener("iceconnectionstatechange ", () => {
      console.log(
        `ICE connection state change: ${peerConnection.iceConnectionState}`
      );
    });
  });

  const createRoom = async () => {
    console.log("create room");
    localStream.getTracks().forEach((track) => {
      console.log("adding localStream to peerConnection");
      peerConnection.addTrack(track, localStream);
    });

    peerConnection.addEventListener("icecandidate", (event) => {
      console.log("listening for icecandidate on peerConnection");
      if (!event.candidate) {
        console.log("final icecandidate");
        return;
      }
      console.log("callerCandidate written to database");
      callerCandidates(roomId).set(event.candidate.toJSON());
    });

    const offer = await peerConnection.createOffer();
    await peerConnection.setLocalDescription(offer);
    console.log("Offer created and added to peerConnection local description");

    const roomWithOffer = {
      offer: {
        type: offer.type,
        sdp: offer.sdp,
      },
    };

    await room(roomId).update(roomWithOffer);
    console.log("Offer written to room database document");

    peerConnection.addEventListener("track", (event) => {
      event.streams[0].getTracks().forEach((track) => {
        console.log(
          "listening for track on peerConnection and adding them to remoteStream"
        );
        remoteStream.addTrack(track);
      });
    });

    room(roomId).on("value", async (snapshot) => {
      console.log("listening for remote session in room database document");
      const data = snapshot.val();
      if (!peerConnection.currentRemoteDescription && data && data.answer) {
        console.log("Got remote description: ", data.answer);
        const rtcSessionDescription = new RTCSessionDescription(data.answer);
        await peerConnection.setRemoteDescription(rtcSessionDescription);
      }
    });

    calleeCandidates(roomId).on("value", (snapshot) => {
      console.log(
        "listening for remote ICE candidates in room/calleCandidates database document"
      );
      if (snapshot.val()) {
        snapshot.val().forEach(async (change) => {
          if (change.type === "added") {
            let data = change.doc.data();
            await peerConnection.addIceCandidate(new RTCIceCandidate(data));
          }
        });
      }
    });
  };
};

Я получаю номер комнаты через реагирующий маршрутизатор, я упустил оставшуюся часть компонента для удобства чтения.

Консоль возвращает следующее:

создать комнату
Изменение состояния сигнализации: have-local-offer
Предложение создано и добавлено в локальное описание peerConnection
Изменено состояние сбора ICE: завершено
прослушивание icecandidate на peerConnection
окончательное icecandidate
добавление localStream к peerConnection
Предложение записано в документ базы данных комнаты
прослушивание удаленных кандидатов ICE в документе базы данных / calleCandidates
прослушивание на удаленном сеанс в базе данных документа

На вкладке about: webrt c firefox я вижу, что предложение создано успешно, но нет кандидатов на льду

Заранее спасибо!