soporte Contactar con asistencia técnica | estado del sistema Estado del Sistema

Paso a paso: Player Administración

Este documento proporciona una introducción práctica a las operaciones básicas de la Player Management API.

Introducción

En este documento paso a paso, realizará las siguientes tareas:

  • Crea un player
  • Actualizar el player para reproducir automáticamente el video
  • Personaliza un player agregando un complemento
  • Mostrar la configuración para un player

Comience

El enfoque que toma este documento paso a paso es usar declaraciones curl para comunicarse con el Player API de servicio. La herramienta curl se usa en la línea de comando para transferir datos con sintaxis de URL. Se puede obtener más información sobre el rizo en http://curl.haxx.se.

Ciertamente, no tiene que usar el rizo como lo hace en este documento paso a paso por razones de simplicidad. Por supuesto, puede utilizar su idioma favorito para comunicarse con las API. Revisar la Configurar para Player Muestras de gestión que muestra cómo usar la autenticación básica, AJAX y JavaScript para escribir algunas mini aplicaciones para tareas básicas como crear un player, mostrando todos sus players, borrando players, etc.

Deben tomarse algunos pasos preliminares antes de poder comenzar a utilizar la API. Estos son:

  • Inicie sesión en Studio. Si tiene varias cuentas, use el menú desplegable para seleccionar la cuenta en la que desea crear su nueva cuenta players. Para que el sistema de credenciales funcione correctamente, debe tener derechos de administrador en esta cuenta. Si no está seguro de si un usuario tiene derechos de administrador, vaya a la página Configuración de usuarios para ver a los Usuarios enumerados junto con su función.
  • En Studio, asegúrese de haber seleccionado INICIO de las listas de módulos. En la esquina superior izquierda de la página, usted, justo debajo del nombre de la cuenta, podrá copiar su ID de la cuenta.
    ID de cuenta para copiar
  • En la línea de comando, ingrese lo siguiente para asignar el valor de ID de cuenta a una variable de entorno:
            export ACCOUNT_ID=YourAccountID
            
            
  • La autenticación se manejará mediante el suministro de la dirección de correo electrónico de su cuenta como parte de la declaración curl, y luego la API le solicitará una contraseña. Dado que la dirección de correo electrónico se usará con frecuencia, también asigne ese valor a una variable de entorno:
            export EMAIL=YourEmailAddress
            
            

Ahora está listo para comenzar a usar la API.

Crea un player

Ahora puedes crear un player con una llamada a la Player Management API. Esta llamada a la API se explica en detalle en el Player Management API Resumen documento. Se sugiere copiar y pegar las siguientes instrucciones curl en la línea de comando.

Los siguientes pasos lo ayudan a crear un player.

  1. La primera instrucción curl crea el player y asigna un nombre y una descripción. Después de pegar esta declaración en la línea de comando y presionar enter, se le pedirá su contraseña.
            curl \
              --header "Content-Type: application/json" \
              --user $EMAIL \
              --request POST \
              --data '{
                "name": "My New Player Name v2",
                "description": "My new player description"
                }' \
              https://players.api.brightcove.com/v1/accounts/$ACCOUNT_ID/players
            

    Verá que el servidor devuelve datos de respuesta en formato JSON:

            {
              "id": "S1qN4xeG7",
              "url": "http://players.brightcove.net/1507807800001/S1qN4xeG7_default/index.html",
              "embed_code": "<iframe src='//players.brightcove.net/1507807800001/S1qN4xeG7_default/index.html' allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>",
              "embed_in_page": "http://players.brightcove.net/1507807800001/S1qN4xeG7_default/in_page.embed",
              "preview_url": "http://preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/index.html",
              "preview_embed_in_page": "http://preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/in_page.embed",
              "preview_embed_code": "<iframe src='//preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/index.html' allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>"
            }
            
  2. Ver su player mediante el uso de uno (o todos) de los siguientes valores (en este momento, no hay video en el player, pero puedes publicar un video usando tu recién creado player usando Studio):
    • Copia el url en un navegador para ver tu player.
    • Copia el embed_code en una página HTML para ver su player en un iframe Para que esto funcione correctamente, la página que contiene el iframe debe servirse desde un servidor HTTP real.
    • La embed_in_page el uso de la función se detalla en Opciones disponibles para el código de inserción avanzado (en página) documento.

Video Cloud vídeos

Por supuesto que puedes crear un player usando un video de tu Video Cloud biblioteca. En lugar de utilizar un media sección en los datos JSON, utiliza un video_cloud sección. La siguiente declaración de rizo muestra player creación utilizando un Video Cloud ID del video.

        curl \
          --header "Content-Type: application/json" \
          --user $EMAIL \
          --request POST \
          --data '{
            "name": "Video Cloud CURL 10 March",
            "configuration": {
              "video_cloud": {
                "video": "4093372393001"
              }
            }
          }' \
        https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players
        

La respuesta es lógicamente equivalente a la respuesta al crear un player usar medios / fuentes / src como se muestra arriba.

        {
        "id": "HJyMlHiuZ",
        "url": "http://players.brightcove.net/1507807800001/HJyMlHiuZ_default/index.html",
        "embed_code": "<iframe src="//players.brightcove.net/1507807800001/HJyMlHiuZ_default/index.html" allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen=""></iframe>",
        "embed_in_page": "http://players.brightcove.net/1507807800001/HJyMlHiuZ_default/in_page.embed",
        "preview_url": "http://preview-players.brightcove.net/v1/accounts/1507807800001/players/HJyMlHiuZ/preview/embeds/default/master/index.html",
        "preview_embed_code": "<iframe src="//preview-players.brightcove.net/v1/accounts/1507807800001/players/HJyMlHiuZ/preview/embeds/default/master/index.html" allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen=""></iframe>"
        }
        
        

Usted puede ver el player'configuración mediante la exploración del valor de URL devuelto y cambiar el index.html a config.json. Para el player creado por la declaración curl anterior, vería lo siguiente:

        {
          "account_id": "1507807800001",
          "compatibility": true,
          "embed_id": "default",
          "player": {
            "template": {
              "name": "single-video-template",
              "version": "6.5.0"
            }
          },
          "player_id": "HJyMlHiuZ",
          "player_name": "Video Cloud CURL 10 March",
          "updated_at": "2017-08-23T17:48:55.622Z",
          "video_cloud": {
            "policy_key": "BCpkADawqM2FnBS3InxzDxU4bd4otJdHKvexlXfhs_XgSj3jmBHAsV2xANIvSPd4KiakMbiQM5oYJPopOcJD7vNnPWGPGsnXCO3_ZGdjPmur53WV_a4JUPWHCLt5oiyekN44i24jZzHMB6hT",
            "video": "4093372393001"
          }
        }
        

La policy_key se agrega automáticamente a la playerLa configuración de. Esto se crea usando el Policy API, y permitirá que se apliquen restricciones especiales a su player para acceder a diferentes videos. En otras palabras, la clave de política controla qué videos se pueden ver cuando.

Actualizar un player

Ahora ha realizado los conceptos básicos para crear un player. A continuación, aprenderá cómo hacer una actualización simple de player. En este caso, configurará el player para reproducir automáticamente el video en el player, si lo permite el navegador.

  1. En el JSON devuelto de player creación y id valor fue mostrado. Copia esto en una PLAYER_ID Variable ambiental.
            export PLAYER_ID=YourPlayerID
            
            
  2. Para actualizar el player usarás el HTTP PATCH método. Enviarás datos para actualizar tu player. Establecerás el autoplay opción de true. Copie y pegue la siguiente instrucción curl y ejecútela.
            curl \
              --header "Content-Type: application/json" \
              --user $EMAIL \
              --request PATCH \
              --data '{
                "autoplay": true
              }' \
            https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/configuration
            
  3. Verifique para asegurarse de que el servidor devuelva datos que incluyen id , preview_url y preview_embed_code valores en el siguiente formato JSON:
            {
              "id": "S1qN4xeG7",
              "preview_url": "http://preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/index.html",
              "preview_embed_in_page": "http://preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/in_page.embed",
              "preview_embed_code": "<iframe src='//preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/index.html' allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>"
            }
            
  4. Use ya sea el preview_url or preview_embed_code valores para ver los cambios en su playerLa configuración de. Verá que la reproducción automática ahora es verdadera.
  5. Ahora publicarás el player para empujarlo a la ubicación correcta para que lo vean los usuarios. Ingrese el siguiente comando:
            curl \
            --header "Content-Type: application/json" \
            --user $EMAIL \
            --request POST \
            https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/publish
            
            

    Una vez que la player se publica tendrás players que difieren de las versiones de vista previa. Las versiones publicadas difieren de las versiones de vista previa de estas maneras:

    • JavaScript y CSS se minifican, concatenan e incorporan player directamente.
    • Se genera una versión de baja resolución de la imagen del póster y se inserta en la página para mejorar los tiempos de carga percibidos en redes con un alto tiempo de configuración de solicitud (es decir, redes de datos móviles).
    • La versión anterior de la player se guarda para que pueda recuperarse si se descubren problemas después de que la actualización se active.
  6. Compruebe para asegurarse de que la respuesta JSON de publicar el player aparece de la siguiente manera:
            {
            "id": "S1qN4xeG7",
            "url": "http://players.brightcove.net/1507807800001/S1qN4xeG7_default/index.html",
            "embed_code": "<iframe src='//players.brightcove.net/1507807800001/S1qN4xeG7_default/index.html' allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>",
            "embed_in_page": "http://players.brightcove.net/1507807800001/S1qN4xeG7_default/in_page.embed"
            }
            
            
  7. Use uno de los player implementaciones para asegurarse de que haya publicado player Funciona correctamente.

Personaliza un player

Puede personalizar su player utilizando complementos. Puede aprender a incluir complementos preexistentes en su player o construye el tuyo en el Paso a paso: desarrollo de complementos.

En este caso, utilizará un complemento preexistente muy simple para superponer un mensaje de texto en el video. El siguiente es el código de un complemento que crea una etiqueta de párrafo HTML. Nota: se asigna un nombre de clase y texto al párrafo, luego se agrega al texto existente player. Este complemento ya existe para su comodidad y se encuentra en //solutions.brightcove.com/bcls/video-js/new-player/first-plugin.js.

        videojs.registerPlugin('firstPlugin', function() {
          var player = this,
          overlay = document.createElement('p');
          overlay.className = 'vjs-overlay';
          overlay.innerHTML = "First Plugin Working!";
          player.el().appendChild(overlay);
        });
        
        

El párrafo debe diseñarse para evitar, en esta instancia particular, texto negro sobre fondo negro. Los siguientes son estilos aplicados al nombre de clase del párrafo. Esta hoja de estilo ya existe para su conveniencia y se encuentra en //solutions.brightcove.com/bcls/video-js/new-player/first-plugin.css.

        .vjs-overlay {
          background-color: #333333;
          color: white;
          font-size: 2em;
          padding: 5px;
          position: absolute;
          top: 100px;
          left: 20px;
          width: 150px;
        }
        
        

Al igual que usó una declaración curl para asignar la fuente de video y la imagen del póster, usará una declaración curl para indicar player el seguimiento:

  • Ubicación del archivo JavaScript que contiene el código del complemento
  • Ubicación de la hoja de estilo
  • El nombre del complemento que se utilizará con el player
  1. Use la siguiente instrucción curl para hacer que el complemento sea funcional.
            curl\
            --header "Content-Type: application/json"\
            --user $EMAIL\
            --request PATCH\
            --data '{
              "scripts": [
                "//solutions.brightcove.com/bcls/video-js/new-player/first-plugin.js"
               ],
               "stylesheets": [
                "//solutions.brightcove.com/bcls/video-js/new-player/first-plugin.css"
               ],
               "plugins": [{
                 "name": "firstPlugin"
               }]
              }'\
            https: //players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/configuration
            
  2. Use la siguiente instrucción curl para publicar la actualización player. Este es el mismo código de publicación que utilizó en la sección anterior para publicar un player.
            curl \
              --header "Content-Type: application/json" \
              --user $EMAIL \
              --request POST \
              https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/publish
            
  3. Copie la URL devuelta y navegue por ella. Verás que el complemento está funcionando y se muestra el texto del complemento.
    Texto de complemento
    Texto de complemento

Cuando se agrega un complemento a player usando el Player Management API, ya sea un complemento suministrado por Brightcove o un complemento personalizado que haya creado, el complemento se convierte en parte del player código en sí mismo.

Configuración de pantalla

Para depurar y confirmar el trabajo que ha realizado, a menudo es útil ver un playerLa configuración de.

  1. Para hacer esto, usa un GET método con el configuration URL.
            curl \
              --header "Content-Type: application/json" \
              --user $EMAIL \
              --request GET \
              https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/configuration
            
            
  2. Verifique que la respuesta de configuración de JSON sea similar a la siguiente:
            {
              "media": {
                "poster": {
                  "highres": "//solutions.brightcove.com/bcls/assets/images/Tiger.jpg"
                },
                "sources": [{
                  "type": "application/x-mpegURL",
                  "src": "//solutions.brightcove.com/bcls/assets/videos/Tiger.m3u8"
                }, {
                  "type": "video/mp4",
                  "src": "//solutions.brightcove.com/bcls/assets/videos/Tiger.mp4"
                }]
              },
              "compatibility": true,
              "video_cloud": {
                "video": "4093372393001",
                "policy_key": "BCpkADawqM3ugPRAtcx48_C4FjXiEiJORcRFnXkeL9siQUpauO_o7SaIhSnYvM24nUCeD74UFG1LMW8vtmaftsO1vYeeOn2iglfvEbG-c0PYwJ_zQCQGsvkrbgrNyEDvbEKjyrsQVXj0DOco"
              },
              "player": {
                "template": {
                  "name": "single-video-template",
                  "version": "6.7.0"
                }
              },
              "scripts": ["//solutions.brightcove.com/bcls/video-js/new-player/first-plugin.js"],
              "stylesheets": ["//solutions.brightcove.com/bcls/video-js/new-player/first-plugin.css"],
              "plugins": [{
                "name": "firstPlugin"
              }]
            }
            

Otra forma de ver el playerLa configuración es mediante la exploración del valor de URL devuelto y cambiar el index.html a config.json.

API del sistema de entrega

La Delivery System APIs permiten la administración y el despliegue de un grupo de archivos, llamado repositorio. Estos archivos se administran a través de las API REST y a través de git. La mayoría de las personas no deberían necesitar estas API al crear o editar players, pero pueden ser un conjunto muy interesante de API para otros fines. Si desea probarlos, puede hacerlo aquí. Para una introducción práctica, pruebe el Paso a paso: Sistema de entrega documento.


Página actualizada por última vez el 12 jun 2020