Wie behandelt man Audio-Stream in JsSIP?

Question

Ich erstelle React-Anwendung, die JsSIP-Bibliothek verwenden, um Anrufe über VoIP SIP-Provider zu beantworten.

Ich habe bereits eine Seite mit zwei Schaltflächen (Accept und Reject) erstellt. Es erfolgreich registrieren SIP-Client auf SIP-Server. Es erhält auch erfolgreich Anruf und ich kann es beantworten. Aber ich höre nichts während des Anrufs.

Registrieren JsSIP Client (in willReceiveProps, weil ich Informationen für die Verbindung nach Requisiten zu ändern):

const socketHost = 'wss://' + contactCenter.host + ':' + contactCenter.port 
const socket = new JsSIP.WebSocketInterface(socketHost) 
const configuration = { 
    sockets: [socket], 
    uri: 'sip:' + contactCenter.login + '@' + contactCenter.host, 
    password: contactCenter.password, 
    socketHost: socketHost, 
} 

const coolPhone = new JsSIP.UA(configuration) 

coolPhone.on('connected', (e: any) => { 
    const messages = ServiceContainer.get<MessageManagerInterface>(ServiceTypes.Messages) 
    messages.addSuccess('SIP connected') 
}) 

coolPhone.on('newRTCSession', (e: any) => { 
    const messages = ServiceContainer.get<MessageManagerInterface>(ServiceTypes.Messages) 
    messages.addAlert('New call') 

    const session = e.session 

    session.on('failed', this.resetLocalState) 
    session.on('ended', this.resetLocalState) 

    const numberRegexp = /\"(\d+)\"/ 
    const fromNumber = (numberRegexp.exec(e.request.headers.From[0].raw))[1] 
    const toNumber = (numberRegexp.exec(e.request.headers.Contact[0].raw))[1].slice(1) 

    this.setState({ 
     callReceived: true, 
     callSession: session, 
     fromNumber: fromNumber, 
     toNumber: toNumber, 
    }) 
}) 

coolPhone.start() 

Methode, die Antworttaste klicken Griffe:

private answerCall =() => { 
    const messages = ServiceContainer.get<MessageManagerInterface>(ServiceTypes.Messages) 
    messages.addSuccess('Call answered') 

    const callOptions = { 
     mediaConstraints: { 
      audio: true, // only audio calls 
      video: false 
     }, 
     pcConfig: { 
      iceServers: [ 
       { urls: ["stun:stun.l.google.com:19302"] } 
      ], 
      iceTransportPolicy: "all", 
      rtcpMuxPolicy: "negotiate" 
     } 
    } 

    this.state.callSession.answer(callOptions) 

    this.state.callSession.connection.addEventListener('addstream', (event: any) => { 
     console.log(event) 
     this.audioElement.srcObject = event.stream 
    }) 

    this.audioElement.play() 

    this.setState({ 
     callAnswered: true, 
     callReceived: false, 
    }) 
} 

Was habe ich falsch gemacht?

Answer 1

Ich löste das Problem.

Das Problem war in der Position 10 Linie.

Ich zog es an die Callback auf addstream Veranstaltung:

this.state.callSession.connection.addEventListener('addstream', (event: any) => { 
    console.log(event) 
    this.audioElement.srcObject = event.stream 
    this.audioElement.play() 
}) 

Jetzt funktioniert es gut. Hoffe, du findest es auch nützlich.

Answer 2

können Sie react-sip npm Bibliothek benutzen, die innerhalb Nutzung von jssip vereinfacht Apps Reagieren: https://www.npmjs.com/package/react-sip

Sie werden nur die Verbindungseinstellungen als Requisiten <SipProvider/> übergeben müssen, die irgendwo in der Nähe der Spitze Ihres Baum reagieren wird . Damit können Sie grundlegende Start/Stopp/Antwort-Operationen durchführen und den Status Ihres Anrufs im Kontext beobachten!