JsSIP play remote audio

I am using jsSIP with Asterisk in my project. The proplem is I don't jnow how to play audio answer from Asterisk in my browser. Now I am trying this

myPhone.on('newRTCSession', function(data){
    var session = data.session;
        session.on('peerconnection', function(e){
            remoteAudio.src = window.URL.createObjectURL(e.stream);
            remoteAudio.play();
        });
    });

but event is not fired, also i tried event "addstream", but as i understood it is removed in my current JsSIP version (3.2.4)

connecting to Asterisk is fine. I start call, receive answer, then Asterisk must play audio file, and terminate call. And it is terminated after 8 seconds from connecting, but audio is not playing. Here is the answer in RTCSession.connection.remoteDescription.sdp

v=0
o=- 857805013 857805013 IN IP4 127.0.0.1
s=-
t=0 0
a=msid-semantic: WMS
m=audio 19006 RTP/SAVPF 0 8 126
c=IN IP4 95.47.143.134
a=rtcp:19007 IN IP4 95.47.143.134
a=candidate:Hc0a80068 1 udp 2130706431 192.168.0.104 19006 typ host generation 0
a=candidate:S5f2f8f86 1 udp 1694498815 95.47.143.134 19006 typ srflx raddr 192.168.0.104 rport 19006 generation 0
a=candidate:Hc0a80068 2 udp 2130706430 192.168.0.104 19007 typ host generation 0
a=candidate:S5f2f8f86 2 udp 1694498814 95.47.143.134 19007 typ srflx raddr 192.168.0.104 rport 19007 generation 0
a=ice-ufrag:218863545319313f5ed15c9b0503a7f1
a=ice-pwd:5e1dc0457efadffe13b44666585eecb9
a=fingerprint:sha-256 56:EE:4C:B8:78:88:AB:A4:C2:72:84:94:15:BE:7C:6E:D4:BD:2F:21:F1:F6:6D:68:E8:91:14:DC:94:72:75:0C
a=setup:active
a=mid:audio
a=sendrecv
a=rtcp-mux
a=rtpmap:0 PCMU/8000
a=rtpmap:8 PCMA/8000
a=rtpmap:126 telephone-event/8000
a=maxptime:150
a=ptime:20

Upvotes: 1

Views: 4585

Answers (2)

Daniel Nitu
Daniel Nitu

Reputation: 425

The addstream event is now deprecated. You should instead use the track event. Example implementation:

attachRemoteStream(session) {
  // Fetch the existing audio element or create a new one
  const remoteAudio = document.getElementById('remoteAudio')

  session.connection.ontrack = (event) => {
    if (event.track.kind === 'audio') {
      if (event.streams.length > 0) {
        remoteAudio.srcObject = event.streams[0];
      } else {
        const stream = new MediaStream([event.track]);
        remoteAudio.srcObject = stream;
      }
    }
  };
}

And then for incoming calls, call the function on peerconnection:

session.on('peerconnection', (e) => {
  attachRemoteStream(session);
});

Upvotes: 0

Ali BARIN
Ali BARIN

Reputation: 1920

There is an attribute called connection which contains RTCPeerConnection instance in RTCSession instances. As far as I understood, it represents the remote/other part.

So here is a code sample which shows how to add an event listener to catch the media stream of the remote part and use it.

session.connection.addEventListener('addstream', function (e) {
  // set remote audio stream
  const remoteAudio = document.createElement('audio');
  remoteAudio.src = window.URL.createObjectURL(e.stream);
  remoteAudio.play();
});

For incoming calls, session.connection is not instantly instantiated. So you will need to attach another event listener, peerconnection, to catch that as you mentioned in your question. Including that part, it should look as below;

session.on('peerconnection', function(data) {
  data.peerconnection.addEventListener('addstream', function (e) {
    // set remote audio stream
    const remoteAudio = document.createElement('audio');
    remoteAudio.src = window.URL.createObjectURL(e.stream);
    remoteAudio.play();
  });
});

Here are some links which may help you understand it better;

  1. JsSIP.RTCSession.connection
  2. RTCPeerConnection.onaddstream

Upvotes: 5

Related Questions