Come registrare audio o video (HTML)

[ Questo articolo è rivolto agli sviluppatori per Windows 8.x e Windows Phone 8.x che realizzano app di Windows Runtime. Gli sviluppatori che usano Windows 10 possono vedere Documentazione aggiornata ]

Puoi registrare video dalla fotocamera e/o audio dal microfono.

Istruzioni

Inizializzare MediaCaptureSettings

La proprietà MediaCaptureSettings fornisce le impostazioni di configurazione per l'oggetto MediaCapture. Usa la classe MediaCaptureInitializationSettings per inizializzare queste proprietà, come illustrato nell'esempio seguente.

// 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;
    if (deviceList.length > 0)
        captureInitSettings.videoDeviceId = deviceList[0].id;
}

Creare l'oggetto MediaCapture

L'oggetto MediaCapture contiene i metodi e le operazioni asincrone necessarie per acquisire un video.

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

Inizializzare l'oggetto MediaCapture

Usa il metodo MediaCapture.InitializeAsync per inizializzare l'oggetto MediaCapture. Per impostazione predefinita, InitializeAsync usa il dispositivo di acquisizione video predefinito e acquisisce audio o video. In alternativa, puoi creare e inizializzare il tuo oggetto MediaCaptureInitializationSettings personalizzato e passarlo al metodo InitializeAsync.

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

Creare un profilo di codifica

Il profilo di codifica contiene tutte le impostazioni relative alla modalità di codifica del file di destinazione. L'API Windows.Media.MediaProperties include diverse opzioni per creare un oggetto MediaEncodingProfile.

Lo spazio dei nomi Windows.Media.MediaProperties include un set di profili di codifica predefiniti:

  • Audio AAC (M4A)
  • Audio MP3
  • Windows Media Audio (WMA)
  • Video MP4 video (combinazione di video H.264 e audio AAC)
  • Windows Media Video (WMV)

I primi tre profili dell'elenco contengono solo audio. Gli altri due contengono invece anche video.

Il codice seguente consente di creare un profilo per il video MP4.

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

Il metodo CreateMp4 statico crea il profilo di codifica MP4. Il parametro di questo metodo specifica la risoluzione di destinazione del video. In questo caso VideoEncodingQuality.HD720p indica 1280 x 720 pixel a 30 fotogrammi al secondo. "720p" indica 720 linee di scansione progressiva per fotogramma. Gli altri metodi per la creazione di profili predefiniti sono tutti basati su questo schema.

In alternativa, puoi creare un profilo corrispondente a un file multimediale esistente usando il metodo Windows.Media.MediaProperties.MediaEncodingProfile.CreateFromFileAsync. Oppure, se conosci le esatte impostazioni di codifica che desideri, puoi creare un nuovo oggetto Windows.Media.MediaProperties.MediaEncodingProfile e compilare tutti i dettagli del profilo.

Avviare la registrazione

Per avviare l'acquisizione di un video in un file, crea un file per il video acquisito. Chiama quindi il metodo StartRecordToStorageFileAsync, passando l'oggetto MediaEncodingProfile e il file di archiviazione di destinazione.

// 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);
    }  );   
}

Arrestare la registrazione

Per arrestare l'acquisizione del video, chiama il metodo StopRecordAsync.

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

Esempio completo

L'esempio seguente illustra la definizione dei passaggi per la registrazione di video in un file.


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;
    if (deviceList.length > 0)
        captureInitSettings.videoDeviceId = deviceList[0].id;
}


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

// 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);         
}

Pulizia delle risorse MediaCapture

Avviso  

Quando sospendi l'app, è estremamente importante che disattivi ed elimini l'oggetto MediaCapture e gli oggetti correlati. In caso contrario, potresti interferire con le altre app che accedono alla fotocamera dl dispositivo, e creare una esperienza utente negativa per la tua app.

In Windows Phone, pulisci le risorse MediaCapture nel gestore dell'evento della durata dell'app oncheckpoint. In Windows, usa gli eventi SoundLevelChanged e verifica se il livello audio è stato disattivato. In tal caso, pulisci le risorse MediaCapture. Se l'evento indica un altro livello audio, usa l'evento per ricrearle. Questo evento non attiva il tuo codice anche se attivi/disattivi l'audio manualmente mentre l'app è in esecuzione. Perciò, questo evento ha lo stesso scopo delle azioni di sospensione e ripresa sul telefono. Si tratta di un evento necessario perché, in Windows, l'utente può passare da un'app all'altra senza che l'app corrente venga sospesa.

 

Devi pulire le risorse di acquisizione di elementi multimediali nell'evento oncheckpoint in Windows Phone o SoundLevelChanged in Windows, come spiegato nella nota precedente. Un buon modo di farlo consiste nel dichiarare alcune variabili da memorizzare nell'oggetto MediaCapture e attributi booleani che indicano se l'app sta registrando o visualizzando video. Puoi quindi creare una funzione che interrompe la registrazione o la visualizzazione, se sono in corso, chiama il metodo di chiusura dell'oggetto MediaCapture e lo imposta su null. Il codice seguente mostra un esempio di implementazione di questo metodo.

function cleanupCaptureResources()
{
    var promises = [];

    if (mediaCapture) {
        if (isRecording) {
            promises.push(mediaCapture.stopRecordAsync().then(function () {
                isRecording = false;
            }));
        }

        promises.push(new WinJS.Promise(function (complete) {
            mediaCapture.close();
            mediaCapture = null;
            complete();
        }));
    }

    return WinJS.Promise.join(promises).done(null, errorHandler);
}

Aggiungi il codice seguente al tuo gestore dell'evento oncheckpoint. È molto importante che usi una promessa per chiamare il tuo metodo di pulizia. In questo modo il sistema consente il completamento del metodo prima di sospendere l'app.

app.oncheckpoint = function (args) {
    args.setPromise(
        cleanupCaptureResources()
    );
};

Argomenti correlati

Esempio di acquisizione di un file multimediale