访问流回调函数外的变量 - Javascript, WebRTC

Question

我正在流式传输网络摄像头，并且想要一种停止网络摄像头的方法。我试图通过在流媒体轨道上调用 stop 来停止它，尽管我无法在回调函数之外访问轨道变量。如何在回调函数之外访问此函数中的跟踪？基本上是这样的：

var track;
            function successCallback(stream) {
                localstream = stream; // stream available to console
                track = stream.getTracks()[0];
                if (window.URL) {
                    video.src = window.URL.createObjectURL(stream);
                } else {
                    video.src = stream;
                }
            }
track.stop();

完整的实例如下所示：

function media(i) {
            navigator.getUserMedia = navigator.getUserMedia ||
                navigator.webkitGetUserMedia || navigator.mozGetUserMedia;

            var constraints = {
                audio: false,
                video: true
            };
            var video = document.querySelectorAll("video")[i];
            var localstream;

            function successCallback(stream) {
                localstream = stream; // stream available to console
                var track = stream.getTracks()[0];
                if (window.URL) {
                    video.src = window.URL.createObjectURL(stream);
                } else {
                    video.src = stream;
                }

                track.stop();
            }

            function errorCallback(error) {
                console.log('navigator.getUserMedia error: ', error);
            }

            navigator.getUserMedia(constraints, successCallback, errorCallback);
        }

Answer 1

在 media 函数的范围外定义 track。此外，考虑在调用 track.stop() 时撤销 video src 处的 Blob URL 设置。

window.onload = function() {
  let track, url;

  function media(i) {
    navigator.getUserMedia = navigator.getUserMedia ||
      navigator.webkitGetUserMedia || navigator.mozGetUserMedia;

    var constraints = {
      audio: false,
      video: true
    };
    var video = document.querySelectorAll("video")[i];
    var localstream;

    function successCallback(stream) {
      localstream = stream; // stream available to console
      track = stream.getTracks()[0];
      if (window.URL) {
        url = window.URL.createObjectURL(stream);
        video.src = url;
      } else {
        video.src = stream;
      }

      // track.stop();
    }

    function errorCallback(error) {
      console.log('navigator.getUserMedia error: ', error);
    }

    navigator.getUserMedia(constraints, successCallback, errorCallback);
  }

  var button = document.querySelector("button");
  button.onclick = function() {
    track.stop();
    URL.revokeObjectURL(url);
    // document.querySelectorAll("video")[i].src = "";
  }
  media(0)
}

plnkr https://plnkr.co/edit/FJhEBOCTRcE5NUUaEI7B?p=preview

访问流回调函数外的变量 - Javascript, WebRTC

Access variable outside stream callback function - Javascript, WebRTC

javascript

webrtc