Überblick: In-Page Experience Client-API

Einleitung

Die Client-API für In-Page-Erfahrungen ist eine JavaScript-Bibliothek, mit der Sie das Verhalten der In-Page-Erfahrung zur Laufzeit verwalten können, ähnlich wie die Brightcove Player-API zum Steuern des Verhaltens des Players verwendet wird. Die API ist auf jeder Seite verfügbar, auf der eine oder mehrere eingebettete Brightcove-Erlebnisse ausgeführt werden. Es wurde entwickelt, um Dritten bei der Integration von Brightcove Experiences zu helfen. Bietet Zugriff auf aktuelle Player-, Video- und Statusinformationen sowie Hörer für Wiedergabeereignisse.

Siehe das Ganze API-Referenz Einzelheiten zu den verfügbaren Methoden und Ereignissen.

Einstieg.

<div data-experience="5bb2134180b4990011750f06"></div>
<script src="https://players.brightcove.net/1752604059001/experience_5bb2134180b4990011750f06/live.js"></script>

Der einfachste Weg, einen Hinweis auf die Erfahrung zu erhalten, besteht darin, ihr eine zu geben id (in dem div Etikett). Das id kann alles sein, was Sie möchten, solange es innerhalb der Seite eindeutig ist. Da die Erfahrungs-ID selbst in der URL für das Skript enthalten ist (siehe den hervorgehobenen Teil des obigen Codes), können Sie dies auch verwenden:

<div data-experience="5bb2134180b4990011750f06" id="experience_5bb2134180b4990011750f06"></div>
<script src="https://players.brightcove.net/1752604059001/experience_5bb2134180b4990011750f06/live.js"></script>

Jetzt können Sie einen Verweis auf die Erfahrungen mit JavaScript erhalten. Denken Sie daran, dass die Erfahrung in einem implementiert ist iframe Sie können also nicht einfach über ein Skript auf der übergeordneten Seite damit kommunizieren. Stattdessen müssen Sie Ihr Skript in a platzieren benutzerdefinierter HTML-Block in der Erfahrung selbst.

var experience = window.top.bcov.gal.getEmbed('experience_5bb2134180b4990011750f06');

Sobald Sie einen Verweis auf die Erfahrung haben, können Sie Methoden über die API aufrufen. Beachten Sie, dass sich alle Methoden auf das untergeordnete Element beziehen clientApi Objekt:

var experience = window.top.bcov.gal.getEmbed('experience_5bb2134180b4990011750f06'),
experienceApi,
video,
current_video = document.getElementById('current_video'),
video_paused = document.getElementById('video_paused');

experienceApi = experience.clientApi;

// get initial video
video = experienceApi.getCurrentVideo();
current_video.textContent = video.name;

// event listeners
experienceApi.on('videoChanged', function() {
  video = experienceApi.getCurrentVideo();
  current_video.textContent = video.name;
});

experienceApi.on('videoStarted', function() {
  video_paused.textContent = 'false';
});

experienceApi.on('videoPaused', function() {
  video_paused.textContent = 'true';
});