Die Medienfunktionen von Chrome wurden in Version 75 aktualisiert. In diesem Artikel stelle ich die neuen Funktionen vor:
- Vorhersagen, ob die Wiedergabe für verschlüsselte Medien flüssig und energieeffizient ist.
- Unterstützung des
playsInline-Attribut-Hinweises des Videoelements.
Verschlüsselte Medien: Informationen zur Dekodierung
Seit Chrome 66 können Webentwickler mithilfe von Decoding-Informationen den Browser anhand von Informationen wie Codecs, Profil, Auflösung und Bitrate nach den Dekodierungsfunktionen für nicht geschützte Inhalte des Geräts fragen. Anhand der bisherigen Wiedergabestatistiken, die vom Browser erfasst wurden, wird angegeben, ob die Wiedergabe flüssig (zeitnah) und energieeffizient ist.
Die Spezifikation der Media Capabilities API, die Dekodierungsinformationen definiert, wurde inzwischen aktualisiert, um auch verschlüsselte Medienkonfigurationen zu verarbeiten. So können Websites, die verschlüsselte Medien (EME) verwenden, die optimalen Medienstreams auswählen.
Hier ist eine kurze Zusammenfassung der Funktionsweise von Decoding Info für EME: Probieren Sie das offizielle Beispiel aus.
const encryptedMediaConfig = {
type: 'media-source', // or 'file'
video: {
contentType: 'video/webm; codecs="vp09.00.10.08"',
width: 1920,
height: 1080,
bitrate: 2646242, // number of bits used to encode a second of video
framerate: '25' // number of frames used in one second
},
keySystemConfiguration: {
keySystem: 'com.widevine.alpha',
videoRobustness: 'SW_SECURE_DECODE' // Widevine L3
}
};
navigator.mediaCapabilities.decodingInfo(encryptedMediaConfig).then(result => {
if (!result.supported) {
console.log('Argh! This encrypted media configuration is not supported.');
return;
}
if (!result.keySystemAccess) {
console.log('Argh! Encrypted media support is not available.')
return;
}
console.log('This encrypted media configuration is supported.');
console.log('Playback should be' +
(result.smooth ? '' : ' NOT') + ' smooth and' +
(result.powerEfficient ? '' : ' NOT') + ' power efficient.');
// TODO: Use `result.keySystemAccess.createMediaKeys()` to setup EME playback.
});
EME-Wiedergaben haben spezielle Dekodierungs- und Rendering-Codepfade. Das bedeutet, dass die Codec-Unterstützung und Leistung im Vergleich zu der bei der Wiedergabe ohne Verschlüsselung unterschiedlich ist. Daher muss im Medienkonfigurationsobjekt, das an navigator.mediaCapabilities.decodingInfo() übergeben wird, ein neuer keySystemConfiguration-Schlüssel festgelegt werden. Der Wert dieses Schlüssels ist ein Wörterbuch mit einer Reihe von bekannten EME-Typen. Dabei werden die Eingaben, die an requestMediaKeySystemAccess() von EME übergeben werden, mit einem wichtigen Unterschied repliziert: Sequenzen von Eingaben, die an requestMediaKeySystemAccess() übergeben werden, werden zu einem einzelnen Wert zusammengeführt, wenn die Absicht der Sequenz darin bestand, dass requestMediaKeySystemAccess() eine von ihm unterstützte Teilmenge auswählt.
Decoding-Informationen beschreiben die Qualität (Laufruhe und Energieeffizienz) der Unterstützung für ein einzelnes Paar von Audio- und Videostreams, ohne eine Entscheidung für den Anrufer zu treffen. Anrufer sollten Medienkonfigurationen wie bei requestMediaKeySystemAccess() bestellen. Nur jetzt gehen sie die Liste selbst durch.
navigator.mediaCapabilities.decodingInfo() gibt ein Versprechen zurück, das asynchron mit einem Objekt mit drei Booleschen Werten supported, smooth und powerEfficient aufgelöst wird. Wenn jedoch ein keySystemConfiguration-Schlüssel festgelegt ist und supported den Wert true hat, wird auch ein weiteres MediaKeySystemAccess-Objekt namens keySystemAccess zurückgegeben. Damit können einige Medienschlüssel angefordert und die Wiedergabe verschlüsselter Medien eingerichtet werden. Beispiel:
// Like rMSKA(), orderedMediaConfigs is ordered from most to least wanted.
const capabilitiesPromises = orderedMediaConfigs.map(mediaConfig =>
navigator.mediaCapabilities.decodingInfo(mediaConfig)
);
// Assume this app wants a supported and smooth media playback.
let bestConfig = null;
for await (const result of capabilitiesPromises) {
if (result.supported && result.smooth) {
bestConfig = result;
break;
}
}
if (bestConfig) {
const mediaKeys = await bestConfig.keySystemAccess.createMediaKeys();
// TODO: rest of EME path as-is
} else {
// Argh! No smooth configs found.
// TODO: Maybe choose the lowest resolution and framerate available.
}
Hinweis: Für die Dekodierung von Informationen für verschlüsselte Medien ist HTTPS erforderlich.
Außerdem kann es auf Android- und ChromeOS-Geräten genauso wie requestMediaKeySystemAccess() eine Nutzeraufforderung auslösen. Es werden jedoch nicht mehr Aufforderungen als bei requestMediaKeySystemAccess() angezeigt, obwohl für die Einrichtung der verschlüsselten Medienwiedergabe mehr Aufrufe erforderlich sind.
Intent to Experiment | Chromestatus-Tracker | Chromium-Fehler
HTMLVideoElement.playsInline
Chrome unterstützt jetzt das boole Attribut playsInline. Wenn das Attribut vorhanden ist, wird dem Browser mitgeteilt, dass das Video standardmäßig „inline“ im Dokument angezeigt werden soll, begrenzt auf den Wiedergabebereich des Elements.
Ähnlich wie in Safari, wo Videoelemente auf dem iPhone nicht automatisch im Vollbildmodus gestartet werden, können einige Einbettungspartner mit diesem Hinweis die Videowiedergabe automatisch im Vollbildmodus starten. Webentwickler können diese Funktion bei Bedarf deaktivieren.
<video playsinline></video>
Da Chrome auf Android-Geräten und dem Computer kein automatisches Vollbild implementiert, wird der Hinweis für das Attribut playsInline des Videoelements nicht verwendet.