JsSIPでオーディオストリームを処理する方法は？

Question

私は、JsSIPライブラリを使用してVoIP SIPプロバイダ経由の呼び出しに応答するReactアプリケーションを作成しています。

私は既に2つのボタン（受諾と拒否）を持つページを作成しました。 SIPサーバにSIPクライアントを正常に登録します。それも正常に呼び出しを受信し、私はそれに答えることができます。しかし、電話に出ている間は何も聞こえません。 （willReceivePropsで私は小道具を変更した後、接続のための情報を持っているので）

登録JsSIPクライアント：解答ボタンのクリックを扱う

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() 

方法：

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, 
    }) 
} 

私が間違って何をしたのですか？

Answer 1

私はこの問題を解決しました。

問題は、this.audioElement.play()行の位置にありました。

私はaddstreamイベントのコールバックにそれを移動：

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

は、今では正常に動作します。あなたはまたそれが有用であることを願っています。

あなたが内部のアプリケーションに反応jssipの使用を簡素化 react-sip NPMライブラリを使用することができます

Answer 2

： https://www.npmjs.com/package/react-sip

あなただけのどこかに反応し、ツリーの上部付近にされる、<SipProvider/>に小道具として、あなたの接続設定を渡す必要があります。 これにより、基本的な開始/停止/応答操作を実行し、コンテキスト内で通話のステータスを見ることができます。