Web- und HTML5-Wiedergabe
Integrieren Sie DRM-X 6.0 geschützte Web-Wiedergabe mit der Universal Player, qualifizierte Shaka, PHP, ASP.NET Core, automatische DRM Auswahl und sichere Diagnose.
Verwenden Sie zuerst die vollständige Probe#
Das Webpaket enthält das neueste lokale Universal Player JavaScript und Deklarationen, qualifizierte Shaka, eine lauffähige PHP Anwendung, ein lauffähiges ASP.NET Core Beispiel und eine Integration README. Produktionsseiten können Shaka und Universal Player aus dem DRM-X CDN laden; das Paket behält aktuelle lokale Dateien für die Überprüfung, Entwicklung und kontrolliertes Fallback.
- Richten Sie Site ID, Site Key und Access Key auf dem Server ein.
- Legen Sie die vertrauenswürdige Veröffentlichte geschützte Datei Content ID und benannte Richtlinie fest.
- Ersetzen Sie die Beispiel-Login- und Berechtigungsentscheidung durch Ihre Geschäftslogik.
Minimale Kundengrenze#
<script src="https://drm-x6-cdn.1aicloud.com/sdk/drmx-universal-player/v1/drmx-universal-player.js"></script>
<drmx-universal-player id="player"></drmx-universal-player>
<script>
// Call your authenticated backend, not api6.drm-x.com.
const session = await fetch('/api/playback/session', {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({contentId: 'trusted-catalog-reference'})
}).then(r => r.json());
await window.DrmXUniversalPlayer.start(document.querySelector('#player'), session);
</script>Automatisches Verhalten DRM#
- Windows Microsoft Edge bevorzugt PlayReady. Wenn der qualifizierte PlayReady Pfad vor der Wiedergabe fehlschlägt, kann der Auto-Modus ein begrenztes Widevine Fallback verwenden.
- Chrome und unterstützt Android Browser verwenden Widevine.
- Safari auf iPhone und iPad verwendet native HLS FairPlay. Bei unterstütztem macOS Safari wird qualifizierte Shaka MSE FairPlay bevorzugt, wenn verfügbar, mit nativem HLS Fallback.
- Kompatible Huawei Browser verwenden die qualifizierten WisePlay Pfad und konservatives automatisches Qualitätsverhalten.
Produktions-Checkliste#
- Serve alles über HTTPS und verwahre Access Keys in Servergeheimnissen.
- Antworten auf die Wiedergabesitzung mit
Cache-Control: no-storezurückgeben. - Beharren Sie nicht auf manifesten URLs, Token oder Session-Antworten in
localStorage. - Halten Sie detaillierte redigierte Logs Opt-in und Zeit begrenzt; notieren Sie keine Lizenzbytes oder Autorisierung.
- Testen Sie physisch Windows Edge, macOS Safari, iPhone/iPad Safari, Android und jede Geräteklasse, die Sie bewerben.
HTML5 Wiedergabe mit einer Web Component#
<script
src="https://drm-x6-cdn.1aicloud.com/shaka-player-5.2.4-drmx.2-6557ae581f1c.js"
integrity="sha384-QzxDZ19XaYAL308fvtVjFjUX9RpRxtSfEZ1k1lm8FsRuML1MgNEORVMCtmToCFb8"
crossorigin="anonymous"></script>
<script
src="https://drm-x6-cdn.1aicloud.com/drmx-universal-player-1.2.0-preview.6-fa4b95431a9a.js"
integrity="sha384-gwj1QszshenHjMEkHTTDEpozi6rbhsQgPlaq+aHBCgHiuEd2VK0P8tOB8BWaMQRr"
crossorigin="anonymous"></script>
<drmx-universal-player
content-id="course-12-lesson-4"
content-type="vod"
session-endpoint="/api/drmx/playback-session">
</drmx-universal-player>
Der Browser ruft nur Ihren authentifizierten Endpunkt gleichen Ursprungs auf. Auto wählt das entsprechende unterstützte DRM und registrierte DASH/HLS Manifest. Bitrate, Audiosprache/Kanal, Untertitel, Bild-in-Bild, Vollbild und Wiedergabegeschwindigkeit sind eingebaut.
Verwenden von Shaka, Video.js, Bitmovin oder einem anderen EME Player
Fordern Sie den Vertrag v1 von Ihrem Backend an, laden Sie manifestUrl und fügen Sie Authorization: Bearer {drmLicenseToken} nur zu DRM Lizenz- und FairPlay Zertifikatsanforderungen hinzu. Behalten Sie die undurchsichtigen Herausforderungs- und Lizenzantwortbytes genau. Verwenden Sie die zurückgegebene Release-Route, wenn die Wiedergabe endet.
Universal Player Playlists und Shared Controls#
Die Web- und Android-Editionen verwenden ein konsistentes dunkles Einstellungsfeld mit kompakten blauen Steuerelementen. Playlists unterstützen next/previous, shuffle, repeat one/all und stornierbaren automatischen Fortschritt. Jedes Element verwendet eine neue autorisierte Wiedergabeanforderung. Kapitel- und Transkript-Metadaten stammen aus Ihrem Inhaltskatalog.
Wiedergabegeschwindigkeit, Sleep-Timer, Untertitel, erlaubte Qualität, Audiosprachen, Session-Lesezeichen und A-B-Looping sind verfügbar. Web fügt Tastaturkürzel, optionale Viewer-scoped lokalen Lebenslauf, Transkript-Suche und unterstützt Browser PiP. Android behält native Widevine Offline-Downloads und Erneuerung. Casting und Cross-Device-Fortschritt erfordern separate Anwendungsintegrationen.
Professional- und Enterprise-Logo-Einstellungen
Branding bleibt von der Videooberfläche fern. Rechtsklicken Sie auf das Web Player oder öffnen Sie Einstellungen → Über Player auf beiden Editionen, um das autorisierte Logo, die Produktinformationen und die Player Version zu sehen. Die runde Einstellungssteuerung und der dunkle Menüstil werden mit Android geteilt. Die Vollbild-Webeinstellungen enthalten auch einen Playlist-Selektor.
Setzen Sie playerBranding in Ihrem vertrauenswürdigen Backend auf {"mode":"hidden"} oder {"mode":"custom","logoUrl":"https://your-site.example/logo.png","label":"Your brand"}. Die Plattform überprüft das aktive Professional- oder Enterprise-Abonnement. Andere Pläne verwenden {"mode":"default"}; nicht autorisierte benutzerdefinierte / versteckte Anforderungen geben 403 zurück. Dies ist getrennt von Sicherheitswasserzeichen.
Die PHP Download enthält editierbare Playlist und Branding-Konfiguration. Android Kunde ZIP Behalten Sie die Playlist-Autorisierung in Ihrem Backend; niemals einbetten API Kunde Zugangsdaten entweder Player.
DRM-X 6.0