Dieser Artikel wurde noch nicht bewertet - Dieses Thema bewerten.

Schnellstart: Aufzeichnen von Video mit der MediaCapture-API

Inhalt dieses Artikels

In diesem Thema wird erläutert, wie Sie Video mithilfe der Windows.Media.Capture-API in einer Datei aufzeichnen. Sie können die Windows.Media.Capture-API zum Steuern des asynchronen Aufzeichnungsvorgangs, zum Auswählen eines Codierungsprofils und zum Senden des erstellten Videos an eine Datei verwenden.

Ein weiteres Beispiel zum Aufzeichnen von Medien in einer Windows Store-App mit JavaScript finden Sie im Beispiel für Medienaufzeichnungen.

Ziel: In diesem Lernprogramm wird dargestellt, wie Sie mithilfe der Windows.Media.Capture-API Video aufzeichnen.

Voraussetzungen

In diesem Thema wird davon ausgegangen, dass Sie mit JavaScript eine einfache Windows Store-App für Windows erstellen können, wobei die Vorlage der Windows-Bibliothek für JavaScript verwendet wird. Hilfe beim Erstellen Ihrer ersten App erhalten Sie unter Erstellen Ihrer ersten Windows Store-App mit JavaScript.

Anweisungen

Deklarieren der Webcamfunktion

Verwenden Sie den Designer der App-Manifestdatei, um die Webcamfunktion hinzuzufügen. Wählen Sie die Registerkarte Funktionen und dann Webcam aus der Liste aus.

Initialisieren der MediaCaptureSettings

Die MediaCaptureSettings-Eigenschaft stellt die Konfigurationseinstellungen für das MediaCapture-Objekt bereit. Verwenden Sie wie im folgenden Beispiel gezeigt die MediaCaptureInitializationSettings-Klasse, um diese Eigenschaften zu initialisieren.

JavaScript
Kopieren 

// Initialize the MediaCaptureInitialzationSettings.
function initCaptureSettings() {
    captureInitSettings = null;
    captureInitSettings = new Windows.Media.Capture.MediaCaptureInitializationSettings();
    captureInitSettings.audioDeviceId = "";
    captureInitSettings.videoDeviceId = "";
    captureInitSettings.streamingCaptureMode = Windows.Media.Capture.StreamingCaptureMode.audioAndVideo;
    captureInitSettings.photoCaptureSource = Windows.Media.Capture.PhotoCaptureSource.videoPreview;
    captureInitSettings.realTimeModeEnabled = true;
    if (deviceList.length > 0)
        captureInitSettings.videoDeviceId = deviceList[0].id;
}

Erstellen des MediaCapture-Objekts

Das MediaCapture-Objekt enthält die Methoden und asynchronen Vorgänge, die Sie zum Aufzeichnen eines Videos benötigen.

JavaScript
Kopieren 

    oMediaCapture = new Windows.Media.Capture.MediaCapture();

Initialisieren des MediaCapture-Objekts

Verwenden Sie die MediaCapture.InitializeAsync-Methode, um das MediaCapture-Objekt zu initialisieren. InitializeAsync verwendet das standardmäßige Videoaufzeichnungsgerät und zeichnet entweder Audio- oder Videodaten auf. Alternativ können Sie ein eigenes MediaCaptureInitializationSettings-Objekt erstellen und initialisieren und an die InitializeAsync-Methode übergeben.

JavaScript
Kopieren 

// Create and initialze the MediaCapture object.
function initMediaCapture() {
    oMediaCapture = null;
    oMediaCapture = new Windows.Media.Capture.MediaCapture();
    oMediaCapture.initializeAsync(captureInitSettings).then (function (result) {
       createProfile();
    }, errorHandler);    
}

Erstellen eines Codierungsprofils

Das Codierungsprofil enthält alle Einstellungen für die Codierung der Zieldatei. Die MediaProperties-API stellt verschiedene Optionen zum Erstellen eines MediaEncodingProfile-Objekts bereit.

Der Windows.Media.MediaProperties-Namespace stellt einen Satz vordefinierter Codierungsprofile bereit:

  • AAC-Audio (M4A)
  • MP3-Audio
  • Windows Media Audio (WMA)
  • MP4-Video (H.264-Video und AAC-Audio)
  • Windows Media Video (WMV)

Die ersten drei Profile in der Liste enthalten nur Audio. Die anderen zwei Profile enthalten Video und Audio.

Der folgende Code erstellt ein Profil für MP4-Video.

JavaScript
Kopieren 

// Create a profile.
function createProfile() {
    profile = Windows.Media.MediaProperties.MediaEncodingProfile.createMp4(
        Windows.Media.MediaProperties.VideoEncodingQuality.qvga);
}

Die statische CreateMp4-Methode erstellt ein MP4-Codierungsprofil. Der Parameter dieser Methode bestimmt die Zielauflösung für das Video. In diesem Fall bedeutet VideoEncodingQuality.HD720p 1280 x 720 Pixel mit 30 Frames pro Sekunde. ("720p" steht für 720 progressive Scanlinien pro Frame.) Die anderen Methoden für das Erstellen vordefinierter Profile folgen diesem Muster.

Alternativ können Sie mit der MediaProperties.MediaEncodingProfile.CreateFromFileAsync-Methode ein Profil erstellen, das einer vorhandenen Mediendatei entspricht. Falls Sie die genauen Codierungseinstellungen kennen, können Sie auch ein neues MediaProperties.MediaEncodingProfile-Objekt erstellen und sämtliche Profildetails eingeben.

Starten der Aufzeichnung

Um die Aufzeichnung eines Videos in einer Datei zu starten, erstellen Sie eine Datei für das aufgezeichnete Video. Rufen Sie anschließend die StartRecordToStorageFileAsync-Methode auf, und übergeben Sie MediaEncodingProfile sowie die Zielspeicherdatei.

JavaScript
Kopieren 

// Start the video capture.
function startMediaCaptureSession() {
   Windows.Storage.KnownFolders.videosLibrary.createFileAsync("cameraCapture.mp4", Windows.Storage.CreationCollisionOption.generateUniqueName).then(function (newFile) {
        storageFile = newFile;
        oMediaCapture.startRecordToStorageFileAsync(profile, storageFile).then(function (result) {           
           
        }, errorHandler);
    }  );   
}

Beenden der Aufzeichnung

Um die Videoaufzeichnung zu beenden, rufen Sie die StopRecordAsync-Methode auf.

JavaScript
Kopieren 

// Stop the video capture.
function stopMediaCaptureSession() {
    oMediaCapture.stopRecordAsync().then(function (result) {
        
    }, errorHandler);         
}

Vollständiges Beispiel

Im folgenden Beispiel sind die Schritte zum Aufzeichnen des Videos in einer Datei zusammengefasst.

JavaScript
Kopieren 


var oMediaCapture;
var profile;
var captureInitSettings;
var deviceList = new Array();
var recordState = false;
var storageFile;



function errorHandler(e) {
    sdkSample.displayStatus(e.message + ", Error Code: " + e.code.toString(16));
}



// Begin initialization.
function initialization() {
    document.getElementById("message").innerHTML = "Initialization started.";
    enumerateCameras();   
}


// Identify available cameras.
function enumerateCameras() {
    var deviceInfo = Windows.Devices.Enumeration.DeviceInformation;
    deviceInfo.findAllAsync(Windows.Devices.Enumeration.DeviceClass.videoCapture).then(function (devices) {
        // Add the devices to deviceList
        if (devices.length > 0) {
           
            for (var i = 0; i < devices.length; i++) {
                deviceList.push(devices[i]);              
            }
     
            initCaptureSettings();
            initMediaCapture();
            document.getElementById("message").innerHTML = "Initialization complete.";

        } else {
            sdkSample.displayError("No camera device is found ");            
        }
    }, errorHandler);
}


// Initialize the MediaCaptureInitialzationSettings.
function initCaptureSettings() {
    captureInitSettings = null;
    captureInitSettings = new Windows.Media.Capture.MediaCaptureInitializationSettings();
    captureInitSettings.audioDeviceId = "";
    captureInitSettings.videoDeviceId = "";
    captureInitSettings.streamingCaptureMode = Windows.Media.Capture.StreamingCaptureMode.audioAndVideo;
    captureInitSettings.photoCaptureSource = Windows.Media.Capture.PhotoCaptureSource.videoPreview;
    captureInitSettings.realTimeModeEnabled = true;
    if (deviceList.length > 0)
        captureInitSettings.videoDeviceId = deviceList[0].id;
}


// Create a profile.
function createProfile() {
    profile = Windows.Media.MediaProperties.MediaEncodingProfile.createMp4(
        Windows.Media.MediaProperties.VideoEncodingQuality.qvga);
}

// Create and initialze the MediaCapture object.
function initMediaCapture() {
    oMediaCapture = null;
    oMediaCapture = new Windows.Media.Capture.MediaCapture();
    oMediaCapture.initializeAsync(captureInitSettings).then (function (result) {
       createProfile();
    }, errorHandler);    
}


// Start the video capture.
function startMediaCaptureSession() {
   Windows.Storage.KnownFolders.videosLibrary.createFileAsync("cameraCapture.mp4", Windows.Storage.CreationCollisionOption.generateUniqueName).then(function (newFile) {
        storageFile = newFile;
        oMediaCapture.startRecordToStorageFileAsync(profile, storageFile).then(function (result) {           
           
        }, errorHandler);
    }  );   
}

// Stop the video capture.
function stopMediaCaptureSession() {
    oMediaCapture.stopRecordAsync().then(function (result) {
        
    }, errorHandler);         
}

Zusammenfassung

In diesem Thema wird beschrieben, wie Sie mithilfe der MediaCapture-Klasse Video aufzeichnen.

Verwandte Themen

Roadmaps
Roadmap für Windows Store-Apps mit JavaScript
UX-Design für Apps
Hinzufügen von Multimediainhalten
Beispiele
Beispiel für Medienaufzeichnungen
Beispiel für Kameraaufnahme-UI
Beispiel für Kameraoptions-UI
Beispiel für Geräteenumeration
Beispiel für Echtzeitkommunikation
Beispiel für Medienerweiterungen
Aufgaben
Schnellstart: Aufnehmen eines Fotos oder Videos mithilfe des Kameradialogfelds
Referenz
Windows.Media
Windows.Media.Capture
Windows.Media.Devices
Windows.Media.MediaProperties
HTML5-Elemente "Audio" und "Video"
Weitere Ressourcen
Unterstützte Audio- und Videoformate
Audio- und Videoleistung

 

 

War diese Seite hilfreich?
Ihr Feedback ist uns wichtig.
Teilen Sie uns Ihre Meinung mit.
Weiteres Feedback?
Vielen Dank!
Vielen Dank für Ihr Feedback.
© 2013 Microsoft. Alle Rechte vorbehalten.