Introduction
Les points de repère sont des emplacements spécifiés sur la chronologie vidéo. Lorsque la vidéo est lue, un événement est automatiquement diffusé chaque fois qu'un point de repère est atteint - à l'aide de la Player API, vous pouvez écouter ces événements et prendre les mesures que vous souhaitez. De plus, vous pouvez lire toutes les informations sur les points de repère des métadonnées vidéo stockées dans le player mediainfo
objet, ce qui vous permet de marquer les points de repère sur la timeline vidéo d'une certaine manière si vous voulez.
Il existe deux types de points de repère:
- Points d'annonce: ils sont utilisés pour marquer les endroits où une demande d'annonce doit être faite (si la vidéo et player sont activés pour la publicité).
- Points de repère de code: ceux-ci sont utilisés pour prendre des mesures en utilisant le Player API - certaines utilisations typiques sont l'affichage d'une sorte d'appel à l'action (CTA) ou l'affichage d'une image ou d'un texte relatif au contenu vidéo, peut-être sous forme de superposition vidéo ou dans la page autour du player.
Vue d'ensemble
Vous pouvez ajouter des points de repère dans le module Studio Media. Vous pouvez également les ajouter en utilisant le CMS API, qui est la méthode que nous allons utiliser dans cet exemple.
Méthode HTTP
Les points de repère peuvent être ajoutés soit lorsque vous créer la vidéo ou plus tard avec un mise à jour demande. Dans cet exemple, nous les ajouterons à une vidéo existante en faisant un mise à jour vidéo demande, ce qui signifie que vous utiliserez le PATCH
méthode.
Endpoint
Le point de terminaison de la demande de mise à jour de la vidéo est:
https://cms.api.brightcove.com/v1/accounts/account_id
/vidéos/video_id
Demander un corps
Le corps de la requête est un objet JSON pouvant contenir de nombreux éléments de métadonnées vidéo. Ici, nous allons juste regarder le cue_points
champ, qui est défini sur un tableau d'objets point de repère, comme dans l'exemple suivant:
{
"cue_points": [
{
"name": "Ad Cue Point",
"type": "AD",
"time": 2.0,
"metadata": null,
"force_stop": false
},
{
"name": "Code Cue Point",
"type": "CODE",
"time": 4.0,
"metadata": "The metadata might be text or the url for an image to display",
"force_stop": true
}
]
}
Champs d'objets point de repère
Voici une description des champs pour les objets de point de repère.
Notes
- Techniquement, le point de repère est actif jusqu’à ce que le prochain point de repère soit atteint - par conséquent, dans le tableau de points de repère que vous pouvez extraire de la Brightcove Player, vous verrez un
startTime
etendTime
ainsi à untime
pour le point de repère.
Obtention des informations d'authentification
Pour utiliser la CMS API vous aurez besoin d'informations d'identification appropriées.
Le moyen le plus simple d'obtenir des informations d'identification dans la plupart des cas est d'utiliser la section Authentification de l'API Studio Admin (nécessite des autorisations d'administrateur sur votre compte). Voir Gestion des informations d'identification de l'API pour plus de détails. Dans la plupart des cas, vous souhaitez probablement obtenir des autorisations pour tous CMS API opération:

Si les autorisations dont vous avez besoin ne sont pas disponibles dans Studio ou si vous préférez les obtenir directement à partir du OAuth API, utilisez votre choix de Obtenir des informations d'identification client documents énumérés ci-dessous. Quelle que soit l'option choisie, vous devrez demander les permissions d'opération correctes. Ce qui suit peut être utilisé avec cURL ou Postman pour obtenir toutes les autorisations pour le CMS API:
"operations": [
"video-cloud/video/all",
"video-cloud/playlist/all",
"video-cloud/sharing-relationships/all",
"video-cloud/notifications/all"
]
Exemple d'application
Trouver tout le code associé à cet exemple dans cette GitHub référentiel.Voir le stylo CMS API Exemple: ajouter des points de repère par Brightcove Learning Services ( @rcrooks1969) Sur CodePen.
Utilisation du CodePen
- Basculez l'affichage réel de l'application en cliquant sur le bouton Le résultat .
- Cliquez HTML / CSS / JS boutons pour afficher l'un des types de code.
- Cliquez Modifier sur CodePen dans le coin supérieur droit pour bifurquer ce CodePen dans votre propre compte.
- Trouver tout le code associé à cet exemple dans cette GitHub référentiel.
Code de proxy
Pour créer votre propre version de l'exemple d'application sur cette page, vous devez créer et héberger votre propre proxy. (Les proxys utilisés par Brightcove Learning Services acceptent uniquement les demandes des domaines Brightcove.) Un exemple de proxy, très similaire à celui que nous utilisons, mais sans les vérifications qui bloquent les demandes des domaines non Brightcove, se trouve dans ce dépôt GitHub. Vous y trouverez également des instructions de base pour l’utiliser, ainsi qu’un guide plus élaboré sur la création d’applications autour du proxy dans Utilisation des API REST.