Acquisizione di contenuti multimediali e vincoli

La parte multimediale di WebRTC riguarda l'accesso all'hardware in grado di acquisire video e audio, come videocamere e microfoni, nonché il funzionamento dei flussi multimediali. Vengono trattati anche i contenuti multimediali visualizzati, ovvero il modo in cui un'applicazione può acquisire lo schermo.

Dispositivi multimediali

A tutte le videocamere e a tutti i microfoni supportati dal browser si accede e vengono gestiti tramite l'oggetto navigator.mediaDevices. Le applicazioni possono recuperare l'elenco attuale dei dispositivi connessi e anche rilevare le modifiche, poiché molte videocamere e microfoni si connettono tramite USB e possono essere connessi e disconnessi durante il ciclo di vita dell'applicazione. Poiché lo stato di un dispositivo multimediale può cambiare in qualsiasi momento, è consigliabile che le applicazioni si registrino per le modifiche del dispositivo per gestirle correttamente.

Vincoli

Quando accedi ai dispositivi multimediali, è consigliabile fornire vincoli il più dettagliati possibile. Sebbene sia possibile aprire la fotocamera e il microfono predefiniti con un semplice vincolo, potrebbe essere fornito un flusso multimediale tutt'altro che ottimale per l'applicazione.

I vincoli specifici sono definiti in un oggetto MediaTrackConstraint, uno per l'audio e uno per il video. Gli attributi di questo oggetto sono di tipo ConstraintLong, ConstraintBoolean, ConstraintDouble o ConstraintDOMString. Questi possono essere un valore specifico (ad es. un numero, un valore booleano o una stringa), un intervallo (LongRange o DoubleRange con un valore minimo e massimo) o un oggetto con una definizione ideal o exact. Per un valore specifico, il browser tenterà di scegliere un valore il più vicino possibile. Per un intervallo, verrà utilizzato il valore migliore. Quando viene specificato exact, vengono restituiti solo i flussi multimediali che corrispondono esattamente a questo vincolo.

// Camera with a resolution as close to 640x480 as possible
{
    "video": {
        "width": 640,
        "height": 480
    }
}

// Camera with a resolution in the range 640x480 to 1024x768
{
    "video": {
        "width": {
            "min": 640,
            "max": 1024
        },
        "height": {
            "min": 480,
            "max": 768
        }
    }
}

// Camera with the exact resolution of 1024x768
{
    "video": {
        "width": {
            "exact": 1024
        },
        "height": {
            "exact": 768
        }
    }
}

Per determinare la configurazione effettiva di una determinata traccia di un flusso multimediale, possiamo chiamare MediaStreamTrack.getSettings(), che restituisce il MediaTrackSettings attualmente applicato.

È anche possibile aggiornare i vincoli di una traccia da un dispositivo multimediale che abbiamo aperto, chiamando applyConstraints() sulla traccia. Ciò consente a un'applicazione di riconfigurare un dispositivo multimediale senza dover prima chiudere lo stream esistente.

Visualizzare contenuti multimediali

Un'applicazione che vuole essere in grado di eseguire l'acquisizione e la registrazione dello schermo deve utilizzare l'API Display Media. La funzione getDisplayMedia() (che fa parte di navigator.mediaDevices) è simile a getUserMedia() e viene utilizzata per aprire i contenuti del display (o una parte di essi, ad esempio una finestra). Il MediaStream restituito funziona allo stesso modo di quando si utilizza getUserMedia().

I vincoli per getDisplayMedia() sono diversi da quelli utilizzati per l'input audio o video normale.

{
    video: {
        cursor: 'always' | 'motion' | 'never',
        displaySurface: 'application' | 'browser' | 'monitor' | 'window'
    }
}

Lo snippet di codice riportato sopra mostra come funzionano i vincoli speciali per la registrazione dello schermo. Tieni presente che questi potrebbero non essere supportati da tutti i browser che supportano i media display.

Stream e tracce

Un MediaStream rappresenta uno stream di contenuti multimediali, costituito da tracce (MediaStreamTrack) audio e video. Puoi recuperare tutte le tracce da MediaStream chiamando MediaStream.getTracks(), che restituisce un array di oggetti MediaStreamTrack.

MediaStreamTrack

Un MediaStreamTrack ha una proprietà kind che è audio o video, a seconda del tipo di media che rappresenta. Ogni traccia può essere disattivata attivando/disattivando la relativa proprietà enabled. Una traccia ha una proprietà booleana remote che indica se proviene da un RTCPeerConnection e da un peer remoto.