MediaStream Image Capture API

Der Prozess des Abrufens eines Bild- oder Videostreams erfolgt wie unten beschrieben. Der Beispielcode ist aus Chromes Image Capture-Beispielen angepasst.

Zuerst erhalten Sie eine Referenz zu einem Gerät, indem Sie MediaDevices.getUserMedia() aufrufen. Das untenstehende Beispiel besagt, dass es mir jedes verfügbare Videogerät geben soll, obwohl die Methode getUserMedia() es ermöglicht, spezifischere Fähigkeiten anzufordern. Diese Methode gibt ein Promise zurück, das mit einem MediaStream-Objekt aufgelöst wird.

navigator.mediaDevices.getUserMedia({ video: true }).then((mediaStream) => {
  // Do something with the stream.
});

Als nächstes isolieren Sie den visuellen Teil des Medienstreams. Dies geschieht durch Aufrufen von MediaStream.getVideoTracks(). Dies gibt ein Array von MediaStreamTrack-Objekten zurück. Der untenstehende Code geht davon aus, dass das erste Element im MediaStreamTrack-Array das zu verwendende ist. Sie können die Eigenschaften der MediaStreamTrack-Objekte verwenden, um das benötigte auszuwählen.

const track = mediaStream.getVideoTracks()[0];

An diesem Punkt möchten Sie möglicherweise die Geräteeigenschaften konfigurieren, bevor Sie ein Bild erfassen. Sie können dies tun, indem Sie applyConstraints() auf dem Track-Objekt aufrufen, bevor Sie etwas anderes tun.

let zoom = document.querySelector("#zoom");
const capabilities = track.getCapabilities();
// Check whether zoom is supported or not.
if (!capabilities.zoom) {
  return;
}
track.applyConstraints({ advanced: [{ zoom: zoom.value }] });

Zuletzt übergeben Sie das MediaStreamTrack-Objekt an den ImageCapture()-Konstruktor. Obwohl ein MediaStream mehrere Arten von Tracks enthält und mehrere Methoden bereitstellt, um sie abzurufen, wird der ImageCapture-Konstruktor eine DOMException vom Typ NotSupportedError auslösen, wenn MediaStreamTrack.kind nicht "video" ist.

let imageCapture = new ImageCapture(track);

ImageCapture

Eine Schnittstelle zum Erfassen von Bildern von einem fotografischen Gerät, das durch ein gültiges MediaStreamTrack referenziert wird.

• MediaStream
• MediaStreamTrack