WebRT C javascript Ошибка обработки кандидата ICE - PullRequest
Новая
       66

WebRT C javascript Ошибка обработки кандидата ICE

0 голосов
/ 27 мая 2020

Я создаю приложение для видеозвонков WebRT C, используя ScaleDrone. js

html: 

<video id="localVideo" autoplay muted></video>
<video id="remoteVideo" autoplay></video>

javascript: 

const drone = new ScaleDrone(<channel-ID>);
const roomName = 'observable-' + roomID;
const configuration = {
  iceServers: [{
    urls: 'stun:stun.l.google.com:19302'
  },
  // own TURN server
  {
     "urls": [
         "turn:192.168.8.5:3478?transport=udp"
      ],
      "username": <username>,
      "credential": <password>
  },

]
};

let room;
let pc;


function onSuccess() {};
function onError(error) {
  console.error(error);
};

drone.on('open', error => {
  if (error) {
    return console.error(error);
  }
  room = drone.subscribe(roomName);
  room.on('open', error => {
    if (error) {
      onError(error);
    }
  });
  // We're connected to the room and received an array of 'members'
  // connected to the room (including us). Signaling server is ready.
  room.on('members', members => {
    console.log('MEMBERS', members);
    // If we are the second user to connect to the room we will be creating the offer
    const isOfferer = members.length === 2;
    startWebRTC(isOfferer);
  });
});

// Send signaling data via Scaledrone
function sendMessage(message) {
  drone.publish({
    room: roomName,
    message
  });
}

function startWebRTC(isOfferer) {
  pc = new RTCPeerConnection(configuration);

  // 'onicecandidate' notifies us whenever an ICE agent needs to deliver a
  // message to the other peer through the signaling server
  pc.onicecandidate = event => {
    if (event.candidate) {
      sendMessage({'candidate': event.candidate});
    }
  };

  // If user is offerer let the 'negotiationneeded' event create the offer
  if (isOfferer) {
    pc.onnegotiationneeded = () => {
      pc.createOffer().then(localDescCreated).catch(onError);
    }
  }

  // When a remote stream arrives display it in the #remoteVideo element
  pc.ontrack = event => {
    const stream = event.streams[0];
    if (!remoteVideo.srcObject || remoteVideo.srcObject.id !== stream.id) {
      remoteVideo.srcObject = stream;
    }
  };

  navigator.mediaDevices.getUserMedia({
    audio: true,
    video: true,
  }).then(stream => {
    // Display your local video in #localVideo element
    localVideo.srcObject = stream;
    // Add your stream to be sent to the conneting peer
    stream.getTracks().forEach(track => pc.addTrack(track, stream));
  }, onError);

  // Listen to signaling data from Scaledrone
  room.on('data', (message, client) => {
    // Message was sent by us
    if (client.id === drone.clientId) {
      return;
    }

    if (message.sdp) {
      // This is called after receiving an offer or answer from another peer
      pc.setRemoteDescription(new RTCSessionDescription(message.sdp), () => {
        // When receiving an offer lets answer it
        if (pc.remoteDescription.type === 'offer') {
          pc.createAnswer().then(localDescCreated).catch(onError);
        }
      }, onError);
    } else if (message.candidate) {
      // Add the new ICE candidate to our connections remote description
      pc.addIceCandidate(
        new RTCIceCandidate(message.candidate), onSuccess, onError
      );
    }
  });
}

function localDescCreated(desc) {
  pc.setLocalDescription(
    desc,
    () => sendMessage({'sdp': pc.localDescription}),
    onError
  );
}

Отлично работает с (Chrome):

  • Мобильный браузер <-> Мобильный браузер
  • Мобильный браузер <-> P C Браузер
  • P C Браузер <-> Мобильный браузер

Не работает с (Chrome):

  • P C браузер <-> P C Browser

OnError Я получаю 

DOMException: Error processing ICE candidate

DOMException: Failed to process local answer sdp: called in wrong state: KStable

Я не могу найти, почему потоковое видео не работает, когда я пытался использовать браузер с P C до P C. Не могли бы вы посоветовать или предложить мне решить эту проблему. Заранее спасибо.

...