JSSIP 和 React 音频问题答案

【问题标题】：JSSIP and React audio issueJSSIP 和 React 音频问题
【发布时间】：2018-06-29 01:54:47
【问题描述】：

所以我使用 jssip 3.2.10 来调用 React 项目。

服务器在 Asterisk 和 CentOS 上设置。

我可以在接听者清楚地听到我的情况下拨打电话，但我听不到他们的音频，也听不到在接听电话之前应该发出的等待（传统）哔声。

它确实适用于一些 sipml5/asterisk udp 在线测试，所以我觉得这是我的客户端问题。我在 Chrome 和 Firefox 上进行了测试（都是最新的，结果相同）。

我的设置

我有一个名为 sip.js 的帮助器来连接：

const JsSIP = require('jssip')
const GLOBAL = require('../globals')

function register(user, pass, cb) {
  console.log('Registering to SIP')
  JsSIP.debug.disable('JsSIP:*')
  const address = GLOBAL.jssip_server + ':' + GLOBAL.jssip_port
  let socket = new JsSIP.WebSocketInterface('ws://' + address + '/ws')

  const configuration = {
    sockets: [socket],
    uri: 'sip:' + user + '@' + GLOBAL.jssip_server,
    authorization_user: user,
    password: pass,
    connection_recovery_min_interval: 3,
    register: true
  }
  let ua = new JsSIP.UA(configuration)
  ua.start()
  cb(ua)
}

export {
  register
}

然后在我的主要组件上执行以下操作：

  componentDidMount() {
    if(GLOBAL.jssip) {
      this.props.dispatch(connecting(true))
      register('***', '***', (ua) => {
        this.setState({ua: ua}, () => {
          this.state.ua.on("registered", () => {
            this.props.dispatch(connecting(false))
            this.setState({critical: false})
          })
          this.state.ua.on("registrationFailed", () => {
            this.props.dispatch(connecting(false))
            this.setState({critical: true})
          })
        })
      })
    }
  }

当我尝试拨打电话时，我会执行以下操作：

  doCall(number) {
    this.props.dispatch(placeCall(call))
      if(GLOBAL.jssip) {
        let eventHandlers = {
          'connecting': (e) => {
            console.log('call is in progress')
            this.setState({sipStatus: "connecting"})
          },
          'progress': (e) => {
            console.log('call is in progress')
            this.setState({sipStatus: "progress"})
          },
          'failed': (e) => {
            console.log('call failed with cause: ', e)
            this.setState({sipStatus: "failed"})
          },
          'ended': (e) => {
            console.log('call ended with cause: ', e)
            this.setState({sipStatus: "ended"})
          },
          'confirmed': (e) => {
            this.setState({sipStatus: "confirmed"})
          }
        }
        let options = {
          eventHandlers: eventHandlers,
          mediaConstraints: { 'audio': true, 'video': false }
        }
        let session = this.state.ua.call('sip:'+number+'@'+GLOBAL.jssip_server, options)

      }
  }

有人知道如何解决这个问题吗？

【问题讨论】：

标签： reactjs sip jssip

【解决方案1】：

感谢这里的回答： How to handle audio stream in JsSIP?

我找到了解决方案，我需要添加到渲染调用的文件中：

<audio ref={(audio) => {this.audioElement = audio}} id="audio-element"></audio>

并将 doCall 最后一位更改为：

this.setState({session: this.state.ua.call('sip:'+number+'@'+GLOBAL.jssip_server, options)}, () =>{
  this.state.session.connection.addEventListener('addstream', (event: any) => {
    this.audioElement.srcObject = event.stream
    this.audioElement.play()
  })
})

【讨论】：