kurentoClient

/**
 * 播放视频流，需要先在HTML里面引入kurento-client.min.js和kurento-utils.min.js
 * @param container 播放视频的HTML元素
 * @param rtspUrl rtsp流地址
 * @param serverUrl 后台服务地址
 * @param spinningImg 加载中的动画
 */
let cofVideo = function (container, { rtspUrl, serverUrl, spinningImg }) {
  this.args = getopts(location.search, {
    ws_uri: serverUrl,
    ice_servers: undefined
  })
  this.spinningImg = spinningImg
  let options = {
    remoteVideo: container
  }
  this.container = container
  this.showSpinner()
  this.rtsp = rtspUrl
  this.webRtcPeer = kurentoUtils.WebRtcPeer.WebRtcPeerRecvonly(options, (error) => {
    if (error) return console.error(error)
    this.webRtcPeer.generateOffer(this.onOffer)
    this.webRtcPeer.peerConnection.addEventListener('iceconnectionstatechange', (event) => {
      if (this.webRtcPeer && this.webRtcPeer.peerConnection) {
        // console.log('oniceconnectionstatechange -> ' + this.webRtcPeer.peerConnection.iceConnectionState)
        // console.log('icegatheringstate -> ' + this.webRtcPeer.peerConnection.iceGatheringState)
      }
    })
  })
  that = this
}
cofVideo.prototype = {
  showSpinner: function () {
    this.container.style.background = `center transparent url(${this.spinningImg}) no-repeat`
  },
  hideSpinner: function () {
    this.container.style.background = ''
  },
  onOffer: function (error, sdpOffer) {
    if (error) throw onError(error)
    kurentoClient(that.args.ws_uri, (error, kurentoClient) => {
      if (error) return onError(error)
      that.kC = kurentoClient
      kurentoClient.create('MediaPipeline', (error, p) => {
        if (error) return onError(error)
        that.pipeline = p
        that.pipeline.create('PlayerEndpoint', { networkCache: 0, uri: that.rtsp }, (error, player) => {
          if (error) return onError(error)
          that.pipeline.create('WebRtcEndpoint', (error, webRtcEndpoint) => {
            if (error) return onError(error)
            setIceCandidateCallbacks(webRtcEndpoint, that.webRtcPeer, onError)
            webRtcEndpoint.processOffer(sdpOffer, (error, sdpAnswer) => {
              if (error) return onError(error)
              webRtcEndpoint.gatherCandidates(onError)
              that.webRtcPeer.processAnswer(sdpAnswer)
            })
            player.connect(webRtcEndpoint, function (error) {
              if (error) return onError(error)
              // console.log('PlayerEndpoint-->WebRtcEndpoint connection established')
              player.play((error) => {
                if (error) return onError(error)
                // console.log('Player playing ...')
              })
              that.hideSpinner() // 播放后隐藏loading
            })
          })
        })
      })
    })
  },
  onError: function (error) {
    if (error) console.error(error)
  },
  destroy () {
    if (this.webRtcPeer) {
      this.webRtcPeer.dispose()
      this.webRtcPeer = null
    }
    if (that.pipeline) {
      that.pipeline.endTransaction()
      that.pipeline.release()
      that.pipeline = null
    }

    if(that.kC){
      that.kC.close()
    }
    that = null
    this.hideSpinner()
  }
}
export default cofVideo
 
function onError (error) {
  if (error) console.error(error)
}
 
function getopts (args, opts) {
  var result = opts || {}
  args.replace(
    new RegExp('([^?=&]+)(=([^&]*))?', 'g'),
    function ($0, $1, $2, $3) { result[$1] = $3 }
  )
  return result
}
function setIceCandidateCallbacks (webRtcEndpoint, webRtcPeer, onError) {
  webRtcPeer.on('icecandidate', (candidate) => {
    // console.log('Local icecandidate ' + JSON.stringify(candidate))
    candidate = kurentoClient.register.complexTypes.IceCandidate(candidate)
    webRtcEndpoint.addIceCandidate(candidate, onError)
  })
  webRtcEndpoint.on('OnIceCandidate', (event) => {
    var candidate = event.candidate
    // console.log('Remote icecandidate ' + JSON.stringify(candidate))
    webRtcPeer.addIceCandidate(candidate, onError)
  })
}