Как реализовать JavaScript-заглушку getUserMedia для отправки пользовательских аудиобайт - PullRequest
0 голосов
/ 18 февраля 2019

Я хочу отправить пользовательские аудиобайты через WebRTC, и поэтому мне нужно написать свой собственный метод getUserMedia с моим собственным MediaTrack.Вот как это выглядит сейчас:

     exports.navigator.getUserMedia = getUserMedia;


     function getUserMedia (constraints, successCallback) {
      console.log("window navigator: ",  exports.parent.navigator);
      console.log("call getUserMedia callback method callback = ", successCallback)
      console.log("createMediaStreamSource is: ",  exports.AudioContext.prototype.createMediaStreamSource);

      return new Promise(function(resolve, reject) {
                          postMessage('WKWebViewGetUserMediaShim_MediaStream_new', constraints, function (trackData) {
                                      var stream = new MediaStream()

                                      for (var i in trackData) {
                                      var data = trackData[i]
                                      var track = new MediaStreamTrack()

                                      track.id = data.id
                                      track.kind = data.kind
                                      track._meta = data.meta
                                      track._stream = stream
                                      console.log("track in promise = ", track);
                                      stream._tracks.push(track)
                                      exports.parent.navigator.tracks[track.kind] = exports.parent.navigator.tracks[track.kind] || {}
                                      exports.parent.navigator.tracks[track.kind][track.id] = track
                                      console.log("tracks in promise = ", tracks);
                                      }
                                     console.log("success callback = ", successCallback)
                                      resolve(stream)
                                      }, function(error){reject(error)})
                        });



    }

  getUserMedia._onmedia = function (kind, data) {

    var tracksByKind = exports.parent.navigator.tracks[kind]
    if (kind === 'audio') {
      data = new Float32Array(base64ToData(data))
    } else if (kind === 'video') {
      data = data
    }
//    console.log("onmedia tracks ", exports.parent.navigator.tracks);
    for (var i in tracksByKind) {
      var track = tracksByKind[i]
//      console.log("data came with data ", data);
//      console.log("track = : ", track);


      track._ondataavailable && track._ondataavailable(data)
    }
}

Метод _onmedia - это место, где я получаю свои собственные байты, а getUserMedia пытаюсь заглушить.Но я не знаю, как правильно установить поток пользовательских байтов для класса MediaStreamTrack.

1 Ответ

0 голосов
/ 19 февраля 2019

Для создания аудио из веб-браузера используйте Web Audio API .Различные методы позволят вам генерировать синтетические звуки.

Если вы хотите контролировать каждый семпл, вы можете использовать ScriptProcessorNode и передавать его AudioProcessEvent * outputBuffer.

Web Audio API даже имеет объект MediaStreamAudioDestinationNode, который позволяет выводить этот сгенерированный звук внутри объекта MediaStream:

btn.onclick = start;

function start() {

  const ctx = new (window.AudioContext || window.webkitAudioContext);

  const processor = ctx.createScriptProcessor(256,1,1);
  processor.onaudioprocess = makeSomeNoise;
  
  const streamNode = ctx.createMediaStreamDestination();
  processor.connect(streamNode);
  const mediaStream = streamNode.stream;

  // for demo output to a MediaElement
  aud.srcObject = mediaStream;
  aud.volume = 0.5;
  aud.play();

}


function makeSomeNoise(evt) {

  const output = evt.outputBuffer.getChannelData(0);
  // loop through the 4096 samples
  for (let sample = 0; sample < output.length; sample++) {
    // noise
    output[sample] = (Math.random() - 0.5) * 0.5;         
  }
  
}
<button id="btn">start</button>
<audio id="aud" controls></audio>
...