Contactez nous
|
+1 888 882-1880
Du lundi au vendredi, de 8h00 à 20h00 (heure de l'Est)

100 flux simultanés en direct à Inter High

bsp-admin-1 on December 27, 2013

PUBLICITÉS MID-ROLL DANS LES ÉMISSIONS EN DIRECT

Sports Communications est la société qui exploite le média sportif en ligne "SPORTS BULL" (abrégé en "Spobu"). Elle a conclu des partenariats avec plus de 60 médias et couvre plus de 40 sports. Il ne s'agit pas seulement de sports ayant une large base de supporters, comme le baseball et le football, mais il recueille également des informations détaillées sur des sports qui sont peut-être mineurs aujourd'hui, mais qui veulent élargir leur base de supporters, et le nombre d'utilisateurs augmente rapidement. Le nombre de téléspectateurs et de visiteurs augmente considérablement pendant les événements, et le nombre d'utilisateurs actifs quotidiens (DAU) pour le tournoi de baseball lycéen de l'été 2018 a dépassé les 3 millions. À l'instar du baseball lycéen, le contenu majeur de l'été est l'Inter-High School Athletic Meet. Yusuke Kumagai, directeur de la société, déclare : "Les sports amateurs ont un public cible très large. Il est profondément ancré dans la communauté locale et peut être pratiqué par des personnes de tous âges, de la génération actuelle aux parents et grands-parents de cette génération. En fait, seule la moitié des personnes travaillant dans notre entreprise ont l'habitude de regarder des sports professionnels. Pourtant, tout le monde est attiré par le sport amateur. Ils ont un charme mystérieux, et c'est peut-être l'expérience originale de nombreux Japonais qui ont eu des activités dans des clubs à l'école. Pour l'entreprise, qui s'efforce de diffuser des informations sur toutes sortes de sports, et pour les fans de Spobu, ce tournoi visant à désigner la meilleure équipe lycéenne du Japon est un événement majeur.

La volonté de retransmettre l'Inter-High en direct a conduit l'entreprise à décider d'adopter une plateforme vidéo. Depuis sa création, l'entreprise a distribué plusieurs contenus vidéo et les réactions des spectateurs ont été bonnes. Cependant, la charge de travail des gestionnaires de contenu était lourde, et il était difficile pour une jeune entreprise disposant d'un petit nombre d'employés de s'engager pleinement dans la vidéo. Lorsqu'il s'agit de diffusion en direct, la charge augmente encore et il est nécessaire de disposer d'un employé à temps plein. Brightcove Video Cloud était le système le mieux adapté pour résoudre ces problèmes.

M. Taiki Kumagai, directeur du département de développement, se souvient : " Le nuage vidéo de Brightcove était la seule solution qui pouvait être utilisée pour assurer une diffusion en direct stable avec des publicités pre-roll et mid-roll. Le fait qu'aucune connaissance informatique ne soit requise pour le fonctionnement était également intéressant, et nous étions convaincus que nous pourrions réaliser la diffusion en direct pour Inter-High.tv et BIG6.tv (Tokyo Big 6 Baseball League) avec notre système actuel.

700 RETRANSMISSIONS EN DIRECT ONT ÉTÉ RÉALISÉES PENDANT LA PÉRIODE INTERMÉDIAIRE.

Brightcove a été adoptée en 2018. À l'époque, l'entreprise comptait une dizaine d'employés. Ils ont procédé à des tests en vue de l'Inter-High d'été, et ont tenu de nombreuses réunions avec des entreprises partenaires locales qui allaient effectivement filmer les matchs. Ils ont ensuite établi un processus pour filmer les vidéos, les importer dans le nuage vidéo de Brightcove et les distribuer. Nous avons décidé de créer un compte dédié et de leur demander de diffuser les vidéos en accédant à la plate-forme vidéo directement depuis la zone locale, ce qui leur évite de charger, télécharger et recharger les vidéos. De cette manière, nous avons pu diffuser les matchs en direct aux téléspectateurs avec un minimum de travail administratif.

Nous allons bientôt entrer dans l'ère de la 5G. Le besoin de vidéo ne fera que croître. Je pense que la préparation de la plateforme et la rationalisation du processus de livraison à l'avance ont été très bénéfiques pour notre entreprise.

Yusuke Kumagai

Directeur, Undo Tsushinsha Co.

La diffusion s'est faite à grande échelle. Plus de 100 vidéos ont été fournies aux téléspectateurs par jour. Des retransmissions en direct ont également été organisées simultanément pour plusieurs sports, avec 700 matchs diffusés en direct au cours de la période. Au final, environ 12 000 vidéos de différentes longueurs ont été éditées et publiées en tant que contenu vidéo.

"Maintenant que nous pouvons effectuer tout notre travail sur la plate-forme vidéo, nous estimons que le nombre total d'heures de travail nécessaires a été réduit d'environ 30 %. Je peux affirmer avec certitude que nous n'aurions pas pu atteindre cette échelle de distribution sans le nuage vidéo de Brightcove " (Taiki Kumagai).

UN CONTENU QUI PEUT ÊTRE APPRÉCIÉ PAR DES "UTILISATEURS PASSIONNÉS".

On dit que le sport amateur compte de nombreux "gros utilisateurs". Ils restent longtemps sur le site et regardent les vidéos en détail. Il y a également de nombreux utilisateurs qui visitent le site à plusieurs reprises. Le nombre d'impressions n'est peut-être pas aussi élevé que pour les sports majeurs, mais il y a incontestablement des utilisateurs passionnés par le sport. L'entreprise s'efforce de fournir un contenu qui permettra à ces utilisateurs d'apprécier encore plus le site.

Yusuke Kumagai déclare : "Notre objectif est de devenir une présence qui "regarde", "joue" et "soutient" les sports. Pour l'instant, nous nous concentrons sur le "visionnage" à l'aide de vidéos, mais nous essayons également de soutenir la création d'expériences à travers le "jeu".

À l'avenir, nous voulons devenir une présence qui soutient. Notre objectif est de nous impliquer plus directement dans le soutien à la transmission de meilleures informations et dans la consultation sur les méthodes de monétisation, tout en cultivant et en développant l'audience intéressée par notre contenu. Ce faisant, ils pourront peut-être transmettre l'attrait d'un excellent contenu vidéo et des recettes publicitaires qu'il génère à toutes sortes d'organisations sportives.

"Nous sommes sur le point d'entrer dans l'ère de la 5G. À mesure que les vitesses de communication augmentent et qu'il devient possible d'échanger de grandes quantités de données à grande vitesse, la demande de vidéos ne fera que croître. Je pense que le fait de préparer la plateforme et de rationaliser le processus de distribution à l'avance a été très bénéfique pour notre entreprise", déclare-t-il.

LA MISE EN PLACE D'UN PIPELINE DE TRANSCODAGE CRYPTÉ DE BOUT EN BOUT

bsp-admin-1 on November 1, 2013

Pour de nombreux clients de Zencoder, la sécurisation de leur contenu pendant le processus de transcodage est une priorité absolue. Maintenant que Zencoder prend en charge les entrées cryptées, les clients peuvent s'assurer que leurs données ne sont jamais stockées en clair lorsqu'elles transitent par Zencoder. En bref, Zencoder peut accepter des entrées cryptées, les décrypter pour le transcodage, puis recrypter les vidéos de sortie avant de les écrire dans un emplacement de stockage. L'importance de ce flux de travail réside dans le fait que les entrées et les sorties sont alors protégées. Si un utilisateur non autorisé parvenait à accéder à ces fichiers cryptés, il ne pourrait pas les visualiser sans la paire clé/IV utilisée pour les crypter. Voyons à quoi ressemblerait ce processus. Avant de commencer, nous avons besoin d'une entrée chiffrée. Pour cet exemple, nous allons crypter un fichier localement à l'aide d'OpenSSL, puis le télécharger sur S3 avant de créer la tâche de transcodage.

$ openssl aes-256-cbc -k zencoderisawesome -in trailer_test.mp4 -out trailer_test.mp4.enc -p

Les -k est le secret que nous voulons utiliser, qui dans ce cas est "zencoderisawesome". Le drapeau -p indique à OpenSSL d'imprimer la clé lorsqu'il a terminé, ce dont nous aurons besoin pour le décryptage plus tard. Pour nous, la sortie ressemblait à ceci :

salt=9E7E90A964768A2F
key=DAFF64EAE3B3AB9C7905871E407293D4987E16DE76578372E161B1261F39CD66
iv =375FDBBB213C062D544FCB5A6ACBA44E

Le fichier est maintenant crypté, vous ne devriez donc pas pouvoir le lire comme vous l'auriez fait auparavant. Nous devons maintenant télécharger le fichier sur S3 ou sur un serveur FTP quelque part pour que Zencoder puisse y accéder. Nous allons utiliser l'interface de téléchargement de S3.Chargement S3Il est temps de construire la demande. Nous utiliserons l'élément Bibliothèque Node.js pour envoyer la requête dans ces exemples, mais les mêmes requêtes pourraient également être envoyées à l'aide d'un autre outil tel que l'outil Demande de constructeur. Nous devrons spécifier la clé de cryptage et l'IV que nous avons utilisés ci-dessus pour l'entrée.

var zencoder = require('zencoder')();
zencoder.Job.create({
  input: "s3://zencoder-demo/trailer_test.mp4.enc",
  decryption_method: "aes-256",
  decryption_key: "DAFF64EAE3B3AB9C7905871E407293D4987E16DE76578372E161B1261F39CD66",
  decryption_password: "zencoderisawesome"
}, function(err, data) {
  if (err) {
    console.log("Job wasn't created");
    return console.log(err);
  }
  console.log("Woo!");
  console.log(data);
});

Cela suffirait à créer une sortie h.264 standard, mais elle ne serait en aucun cas cryptée. Cela peut parfois s'avérer utile, car vous pouvez prendre un fichier mezzanine crypté (un fichier de très haute qualité utilisé pour créer d'autres sorties de moindre qualité) et l'utiliser pour des sorties filigranées ou de moindre qualité à des fins de distribution. Imaginons que nous voulions prendre un fichier mezzanine et le télécharger vers trois services différents. Nous voulons qu'une sortie soit une version non cryptée, de faible qualité, avec un filigrane, et que les deux autres soient cryptées à l'aide de deux clés différentes, l'une avec un filigrane d'identification et l'autre sans. Avant de pouvoir créer cette requête, nous devons générer les deux clés que nous allons utiliser. Nous utiliserons à nouveau OpenSSL pour créer ces nouvelles clés :

$ openssl enc -aes-256-cbc -k supersecret -P
salt=12B83BBF81DFA5B7
key=48A9E3FA8A629AEBA5B4F1FAC962920F0D7084E306E0D01A0ED01C920BBCBD08
iv =2B3CABAB503198DB32394245F54E2A34

$ openssl enc -aes-256-cbc -k anothersecret -P salt=DE2DE044EA5FEB2A key=3AAE9D6E5212224BB9F76E328D2BD826F17B4FC292845B6E3B72634D2C28052D iv =169C3DE53C56E74130CDA57BA85F8255

Nous pouvons maintenant utiliser ces clés pour crypter les sorties pendant le processus de transcodage.

zencoder.Job.create({
  input: "s3://zencoder-demo/trailer_test.mp4.enc",
  decryption_method: "aes-256",
  decryption_key: "DAFF64EAE3B3AB9C7905871E407293D4987E16DE76578372E161B1261F39CD66",
  decryption_password: "zencoderisawesome",
  outputs: [
    {
      url: 's3://some-bucket/decrypted.mp4',
      quality: 3,
      width: 320,
      watermarks: [{
        url: 's3://zencoder-live/test-job-watermark.png'
      }]
    },
    {
      url: 's3://some-other-bucket/encrypted-watermarked.mp4',
      width: 720,
      watermarks: [{
        url: 's3://zencoder-live/test-job-watermark.png'
      }],
      encryption_method: "aes-256",
      encryption_key: '48A9E3FA8A629AEBA5B4F1FAC962920F0D7084E306E0D01A0ED01C920BBCBD08',
      encryption_iv: '2B3CABAB503198DB32394245F54E2A34'
    },
    {
      url: 's3://some-bucket/encrypted-out.mp4',
      width: 720,
      encryption_method: "aes-256",
      encryption_key: '3AAE9D6E5212224BB9F76E328D2BD826F17B4FC292845B6E3B72634D2C28052D',
      encryption_iv: '169C3DE53C56E74130CDA57BA85F8255'
    }
  ]
}, function(err, data) {
  if (err) {
    console.log("Job wasn't created…");
    return console.log(err);
  }
  console.log("Woo!");
  console.log(data);
});

Omettre le cryptage d'une sortie et en crypter deux autres séparément peut sembler une chose farfelue, mais considérez le cas d'utilisation. La sortie de faible qualité pourrait être utilisée comme échantillon (vous pourriez même créer un clip plus court à cette fin). L'une des versions de haute qualité comporte un filigrane identifiant la personne à laquelle la vidéo est téléchargée. Vous pouvez donc lui fournir la clé pour décrypter et regarder, et si la vidéo est retrouvée hors de son contrôle, vous savez de qui il s'agit. La troisième copie, non filigranée, sera téléchargée dans un répertoire que nous contrôlons, afin que nous puissions l'utiliser pour une distribution ultérieure. Une fois que vous avez un de ces fichiers cryptés localement, vous pouvez le décrypter en utilisant un processus similaire à celui que nous avons utilisé pour le crypter à l'origine. Pour décrypter le fichier en filigrane : $ openssl enc -aes-256-cbc -d -K 48A9E3FA8A629AEBA5B4F1FAC962920F0D7084E306E0D01A0ED01C920BBCBD08 -iv 2B3CABAB503198DB32394245F54E2A34 -in encrypted-watermarked.mp4 -out decrypted-watermarked.mp4 Pour décrypter le fichier sans le filigrane : $ openssl enc -aes-256-cbc -d -K 3AAE9D6E5212224BB9F76E328D2BD826F17B4FC292845B6E3B72634D2C28052D -iv 169C3DE53C56E74130CDA57BA85F8255 -in encrypted-out.mp4 -out decrypted-out.mp4 Et voilà ! Vous avez maintenant un pipeline d'encodage crypté de bout en bout. Le fichier crypté utilisé dans ces exemples est disponible à cet emplacement et a été crypté en utilisant ces informations d'identification, alors n'hésitez pas à l'utiliser comme fichier de test. Juste une noteIl ne faut pas confondre cela avec la gestion des droits numériques (DRM). Une solution DRM digne de ce nom gère des éléments tels que les droits d'accès au contenu, qui peuvent être beaucoup plus granulaires, jusqu'à certains appareils et utilisateurs. Les fichiers cryptés ne peuvent être consultés qu'avec la clé de cryptage et le mot de passe associé, mais c'est le seul critère.

PLAYBOOK : COMMENT CRÉER UNE STRATÉGIE DE VIDÉO SPORTIVE

bsp-admin-1 on July 23, 2013

La valeur du sport va au-delà d'un match, d'une ligue, d'une équipe ou d'un joueur. Fondamentalement, le sport est composé de moments. Et les gens ne se souviennent pas seulement d 'un moment ; ils se souviennent de l'endroit où ils se trouvaient, des personnes avec qui ils étaient et même de ce qu'ils mangeaient. Le sport se développe et prospère grâce aux émotions. Qu'il s'agisse de joie, de désespoir ou d'envie, le sport suscite toute une gamme d'émotions en une seconde, un centième de seconde ou après une décennie.

Lorsque les éditeurs envisagent le sport dans le contexte de la vidéo, ils doivent prendre conscience des possibilités d'intéresser les téléspectateurs et de créer une expérience qui allie la spontanéité de l'information, l'arc dramatique du film narratif et, au fil des matchs et des saisons, une mine de données.

Les 4 S du sport

Pour les éditeurs, les possibilités d'accroître l'engagement du public grâce à la vidéo peuvent être regroupées en quatre catégories.

  • Statistiques et scores
  • Social et partage
  • Spontanéité
  • Histoires

Statistiques et scores

Les statistiques et les scores sont la façon dont nous enregistrons, mesurons, analysons et suivons les sports. Inévitablement, quelqu'un ou une équipe reçoit le "W" et au moins une personne ou une équipe reçoit le "L", avec de temps en temps une égalité ou un match nul pour faire bonne mesure.

La vidéo peut fournir un contexte pour tout type de statistiques en temps réel.

Lors d'un événement sportif, s'il est courant de présenter les "grandes" actions, les moments non marqués sont tout aussi efficaces pour comprendre les flux et reflux d'un match, d'une équipe ou d'un joueur.

  • Pénalités (ou appels controversés ou manqués)
  • Des moments apparemment mineurs (par exemple, une hésitation lors d'un échange de relais, le remplacement d'un joueur).
  • La stratégie (par exemple, les coups de pied arrêtés au football ou au volley-ball)
  • Performance (par exemple, répartition des joueurs ou changements dans la vitesse des lanceurs)

Pour certains, le sport lui-même n'est que le véhicule d'une passion encore plus grande qui s'étend non seulement aux matchs, mais aussi aux saisons, aux emplois, aux villes et aux amitiés.

Si les jeux de sports fantastiques sont surtout populaires pour le baseball et le football, il n'est pas rare de voir des jeux de sports fantastiques pour le football, le basket-ball, les courses automobiles, le golf et bien d'autres choses encore.

Pendant la saison des sports fantastiques et au cours d'un match, la vidéo peut être utilisée pour compléter les données en temps réel recueillies lors de matchs récents ou en cours, en mettant en évidence tous les types de "scores" des sports fantastiques, qu'il s'agisse de touchdowns, de buts, d'arrêts de jeu, de gains de mètres importants, etc.

Mais les participants aux sports fantastiques passent également leur temps à regarder passivement un flux de données en temps réel. Les éditeurs peuvent étendre cette expérience axée sur les données à une expérience vidéo allégée en regroupant, consolidant et sérialisant les faits marquants de la vidéo pour en faire une histoire vidéo sur leur équipe et leurs joueurs fantastiques - un "sizzle reel" virtuel de statistiques et de scores.

Plus encore que la synchronisation de la vidéo avec des données récentes ou en temps réel, il est possible d'utiliser la vidéo pour créer un contexte supplémentaire lors de la recherche de statistiques sur les équipes et les joueurs. Les éditeurs peuvent créer des expériences attrayantes en permettant aux consommateurs non seulement de consulter des statistiques, mais aussi d'effectuer des recherches par le biais de la vidéo.

Social et partage

Le sport est généralement une activité sociale à laquelle on participe, à laquelle on assiste et que l'on regarde.

La vidéo peut jouer un rôle important au-delà du simple visionnage du match.

Qu'il soit diffusé via un réseau personnel (courriel ou texte) ou un réseau social (Facebook ou Twitter), le sport vit au-delà de l'instant présent, ce qui accroît sa valeur de rediffusion.

Avec les médias sociaux, les éditeurs peuvent utiliser la vidéo pour :

  • Entamez des conversations sur un moment précis (un score, un score "presque", un fan exubérant ou un entraîneur frustré).
  • Permettre aux téléspectateurs de lancer une conversation sur un moment spécifique, de "remixer" leur propre série de moments ou de créer leur propre récapitulation de type SportsCenter.
  • Créer de nouvelles opportunités de monétisation avec des thèmes de contenu sponsorisés

Les clubs sportifs et les ligues peuvent utiliser la vidéo pour :

  • Annoncer les changements apportés au stade pour attirer les détenteurs d'abonnements ou les spectateurs (par exemple, les options de restauration, les vues depuis les gradins et les suites, les événements spéciaux organisés le jour du match ou les cadeaux publicitaires).
  • Exploiter le contenu généré par les utilisateurs pour renforcer la base de supporters et mobiliser ce public afin de créer une valeur de marque durable (par exemple, les "meilleurs" exemples de panneaux, d'encouragements, de supporters "à la maison", de fêtes d'avant-match et de nourriture).

Spontanéité

Les éditeurs doivent s'assurer que toutes les expériences vidéo, du bureau au mobile en passant par les téléviseurs connectés, s'adaptent au désir du spectateur de découvrir le contenu. Les contenus sportifs ont la particularité d'être.. :

  • Consommés à la fois en direct, en différé et préenregistrés
  • Du point de vue des ligues, des équipes, des joueurs et des supporters
  • Indissociable des données

Avec toutes ces facettes, les éditeurs ont la possibilité d'optimiser la découverte et la promotion afin d'augmenter l'engagement et la monétisation.

Dans le mode de consommation vidéo en flux tendu, les éditeurs doivent laisser le contenu se dérouler spontanément. Un spectateur peut commencer par regarder une rediffusion de la médaille d'or remportée par Michael Phelps par la plus petite des marges : un centième de seconde. En se basant sur la notion de "finish serré" de la vidéo, l'expérience vidéo pourrait automatiquement programmer une liste de lecture dynamique de contenu similaire : Le saut de Christian Laettner contre Kentucky, la victoire de Jimmie Johnson à Talladega en 0,0002 seconde ou la victoire des Blackhawks à la dernière minute pour remporter la Coupe.

Histoires

La vidéo peut raconter une histoire en six secondes ou en six heures. Pour les éditeurs qui se concentrent sur le contenu sportif, chaque vidéo raconte une histoire : l'histoire d'une ligue, d'une équipe, d'un joueur, d'un entraîneur ou d'un fan. Mais les histoires sportives, qui peuvent englober un grand nombre de facteurs, peuvent aller au-delà de l'ensemble plus traditionnel des ligues organisées.

Armés d'une GoPro, nous pouvons regarder un pêcheur lutter avec un Marlin de 950 livres, des alpinistes escalader El Capitan, des joueurs s'adonner au géocaching ou des explorateurs urbains se faufiler sous les pavés de Paris.

Les éditeurs ont la possibilité unique de faire appel aux émotions du consommateur. Alors que le contenu des actualités est éphémère et tire sa valeur à la fois de son immédiateté et de son caractère d'archive historique, un moment de sport peut être regardé encore et encore avec le même degré de dramatisation.

Le sport permet aux gens de s'adonner à leur passion, en tant que participant ou en tant que fan, la vidéo jouant un rôle essentiel pour améliorer l'expérience à chaque victoire, chaque défaite ou chaque match nul.

COMMENT LE MOÛT DE LUXEMBOURG ALIMENTE LE TOUR DE FRANCE

bsp-admin-1 on July 9, 2013

Si l'on compare la population du Luxembourg avec le nombre de participants au Tour de France, on comprend immédiatement pourquoi le cyclisme est devenu le sport national de ce petit pays. Depuis la première "Grande Boucle", qui a débuté il y a 100 ans, 15 grands noms du cyclisme luxembourgeois ont célébré 70 victoires d'étape dans le Tour. Cinq Luxembourgeois ont déjà remporté la course cycliste la plus célèbre du monde et ont pu ramener le maillot jaune à la maison à la fin des trois semaines d'épreuve. Il n'est donc pas étonnant que le cyclisme soit également l'un des sujets les plus brûlants du moment pour l'un des quotidiens les plus importants du pays, le Luxemburger Wort.

Avec sa propre équipe de journalistes et de photographes sur place, le portail d'actualités du Luxemburger Wort, wort.lu, offre à ses lecteurs une couverture vidéo mise à jour quotidiennement. Grâce à Brightcove, une petite équipe gère l'ensemble du contenu vidéo du site directement depuis la salle de rédaction de wort.lu et fournit des vidéos en ligne, de petits reportages vidéo d'une à cinq minutes et d'autres formats tels que des interviews vidéo plus longues. Pendant toute la durée du Tour, les amateurs de cyclisme peuvent suivre le Tour live ticker sur wort.lu et accéder chaque soir aux résumés vidéo officiels des organisateurs, l'Amaury Sport Organization (ASO), sur le site web. Et bien sûr, le journal, qui est publié par Verlag Saint-Paul Luxembourg S.A. avec un tirage quotidien de 85 000 exemplaires, espère que les cyclistes luxembourgeois seront une fois de plus à l'avant-garde de la course en cette année d'anniversaire du Tour.

L'un des facteurs clés dans la décision de l'éditeur de mettre en œuvre Brightcove en 2012 était que le Luxembourg a l'un des taux d'utilisation mobile les plus élevés d'Europe. Dans un pays où les résidents accèdent de plus en plus aux actualités lorsqu'ils sont en déplacement, une diffusion vidéo fiable et de haute qualité sur un large éventail de plates-formes est essentielle. Grâce à notre SDK Video Cloud, l'équipe de développement de wort.lu a pu développer des applications mobiles pour le site wort.lu peu de temps après la mise en œuvre de deux semaines. La mise en œuvre s'est faite en douceur grâce à notre documentation complète et en collaboration avec notre équipe d'assistance.

La localisation a également attiré l'attention des décideurs de l'édition à DMEXCO 2012 sur Brightcove, car wort.lu propose sa couverture du Tour de France et l'ensemble de son contenu éditorial en allemand, en français, en anglais et en portugais. Cela signifie que l'équipe éditoriale peut utiliser Brightcove pour automatiser les étiquettes ou d'autres textes standard pour leur contenu vidéo, tels que les sous-titres, dans plusieurs langues.

Pour Marc Thill, rédacteur en chef du Luxemburger Wort, l'orientation stratégique de wort.lu dans le secteur de la vidéo est claire : " Nos équipes éditoriales en ligne et imprimées se développent lentement ensemble, et pour cela, nous avions besoin d'une solution comme Brightcove qui peut s'adapter à nos besoins vidéo futurs, qui vont certainement augmenter. En particulier, en ce qui concerne la génération de trafic pour notre portail d'actualités en ligne wort.lu, la couverture annuelle du Tour de France est un moment fort de l'année pour nos lecteurs, qui sont traditionnellement enthousiastes à propos du cyclisme.

L'éditeur est conscient que son offre numérique doit également faire ses preuves quotidiennement dans la concurrence croissante pour la domination d'Internet au-delà de ces événements sportifs majeurs, afin de maintenir et d'étendre la position de leader de wort.lu sur le marché de l'information luxembourgeois. Selon Marc Thill, avec Brightcove, la maison d'édition a rempli les conditions techniques nécessaires. L'équipe de la salle de rédaction de wort.lu peut désormais fournir son contenu vidéo en ligne de manière dynamique et fiable à ses différents groupes d'utilisateurs mobiles et en ligne sur une base quotidienne sans trop d'efforts techniques. La maison d'édition peut également répondre à la demande croissante des partenaires publicitaires de wort.lu pour une coopération étroite dans le secteur en ligne en offrant une nouvelle gamme d'options publicitaires vidéo grâce à l'utilisation de Brightcove. La fonction d'analyse, qui est importante pour une monétisation réussie sur le marché de la vidéo, est incluse dans le package Brightcove.

MPEG-DASH : CRÉATION D'UNE NORME POUR L'INTEROPÉRABILITÉ ET LA DIFFUSION DE BOUT EN BOUT

bsp-admin-1 on June 14, 2013

Si vous travaillez dans le domaine des médias, vous avez certainement entendu le terme MPEG-DASH. MPEG-DASH n'est pas un codec, un protocole, un système ou un format. Il s'agit plutôt d'une norme d'interopérabilité, c'est-à-dire de livraison de bout en bout de vidéos sur HTTP.

L'un des principaux objectifs de MPEG-DASH, et manifestement le principal avantage pour les éditeurs, est la possibilité de réduire le coût et l'effort de diffusion d'expériences vidéo premium en direct et préenregistrées à l'aide de normes ouvertes sur l'infrastructure existante. Les expériences vidéo haut de gamme d'aujourd'hui comprennent généralement des exigences en matière de publicité, de sécurité (par exemple, DRM), de lecture à débit adaptatif, de sous-titrage et de prise en charge de plusieurs langues. L'application de ces exigences au contenu en direct et préenregistré dans un paysage d'appareils fragmenté entraîne une complexité (lire : un coût) pour les flux de travail d'encodage, d'emballage, de stockage et de diffusion des éditeurs.

Avec MPEG-DASH, les acteurs du secteur s'efforcent de prendre trois protocoles de facto pour la diffusion vidéo (HTTP Live Streaming d'Apple, HTTP Dynamic Streaming d'Adobe et Smooth Streaming de Microsoft) et de les faire logiquement "évoluer" vers une norme composite. C'est logique. Ces trois protocoles sont tous très similaires en termes d'objectifs à atteindre : la diffusion efficace et sécurisée de contenu pour une lecture à débit adaptatif sur un réseau HTTP. Cependant, ils ne sont pas compatibles entre eux.

Aujourd'hui, la plupart des éditeurs s'efforcent d'assurer l'ubiquité du contenu, en prenant en charge toute une série d'appareils : ordinateurs de bureau, téléphones portables, téléviseurs connectés, consoles de jeux, etc. Par conséquent, si les éditeurs veulent prendre en charge la diffusion en continu à débit adaptatif, ils doivent soit prendre en charge plusieurs formats, protocoles et options de protection du contenu pour une prise en charge plus large sur les appareils et les plateformes, soit normaliser et limiter leur empreinte sur les appareils et les plateformes.

Ni l'un ni l'autre ne sont attrayants. Tout le monde fonctionne de manière inefficace, qu'il s'agisse de la création de contenu (encodage pour de multiples formats et langues, conditionnement pour de multiples systèmes de protection du contenu), du stockage en double, des multiples protocoles de diffusion de contenu, des multiples acteurs aux capacités différentes et des formats publicitaires incohérents.

L'objectif de MPEG-DASH est de rationaliser le flux de travail vidéo afin que les éditeurs puissent gérer efficacement leur flux de travail vidéo et le diffuser sur n'importe quelle plateforme et n 'importe quel appareil.

MPEG-DASH est-il une panacée ?

MPEG-DASH ne définit pas les détails de la mise en œuvre, mais laisse les tâches et les décisions suivantes à l'ensemble du secteur.

  • DRM de bout en bout
  • Codecs
  • Formats de fichiers et compatibilité ascendante
  • Considérations sur les redevances et questions relatives à la propriété intellectuelle actuelle et future

Si les éditeurs se précipitent dans la migration, leurs décisions en matière de technologie et de flux de travail pourraient être dictées par le soutien limité ou incohérent des fournisseurs individuels de l'écosystème et par le manque d'interopérabilité entre les fournisseurs au sein de l'écosystème. Les éditeurs devront alors assembler toutes les parties de leur pile - diffusion de contenu, publicité, analyse, encodage, conditionnement DRM et gestion des licences, et lecture - pour résoudre véritablement le flux de travail de bout en bout.

En fait, la fragmentation que nous avons constatée avec la "norme" HTML5 pourrait être une indication de ce que nous rencontrerons avec MPEG-DASH.

Quels sont les avantages pour Apple ?

On ne voit pas non plus pourquoi Apple ferait la promotion de MPEG-DASH, étant donné qu'il a déployé des efforts considérables autour de HLS et l'a élevé au rang de norme de facto. De nombreux systèmes et entreprises sont construits autour de ce protocole et, à mon avis, il sera probablement difficile de convaincre Apple de sacrifier l'avantage qu'elle a avec HLS et de pousser à la normalisation d'une alternative à son offre.

L'histoire se répète... ou se répète-t-elle ?

Lorsqu'on évalue la viabilité d'une nouvelle norme ou d'un nouveau processus, il est utile de l'examiner sous un angle historique et comparatif.

Prenons l'exemple du transport des marchandises par les entreprises. Avant les années 1950, il n'existait pas de moyen simple et efficace de le faire. Mais au milieu des années 50, le concept de transport intermodal de marchandises et de conteneurs a été introduit. En permettant aux marchandises d'être transportées par bateau, par rail ou par camion dans un format standard, la chaîne d'approvisionnement moderne est née. L'accord sur la normalisation du processus a été la première étape cruciale. MPEG-DASH tente d'accomplir un "changement radical" similaire, mais comme il évite les détails de mise en œuvre, il y a un risque important que la fragmentation finisse par entrer dans l'équation.
Voici les problèmes que nous pourrions rencontrer.

  • Si les implémentations MPEG-DASH ne sont pas rétrocompatibles, il sera nécessaire de prendre en charge à la fois MPEG-DASH et HLS. Si HLS (ou même HDS et Smooth) continue sur une voie qui rend la rétrocompatibilité inefficace, les éditeurs sont obligés de prendre en compte MPEG-DASH et HLS, et Smooth Streaming et HDS.
  • Si les lecteurs côté client (ordinateurs de bureau, téléphones portables, téléviseurs connectés, consoles de jeux) ne peuvent pas prendre en charge MPEG-DASH de manière générale, les éditeurs seront toujours confrontés à la fragmentation des lecteurs. La fragmentation des lecteurs se répercute en amont, ce qui signifie que l'ensemble du flux de travail du contenu - de la lecture à la livraison, de l'emballage à l'encodage - sera dupliqué par rapport au flux de travail MPEG-DASH. Pour de nombreux éditeurs, le coût de l'adoption pourrait ne pas valoir les gains supplémentaires.

Le point de vue de Brightcove

Nos éditeurs sont déjà confrontés à la complexité opérationnelle de la prise en charge de plusieurs formats et des protocoles de diffusion associés. Nous continuerons à améliorer nos capacités afin de réduire les frictions et les efforts nécessaires à toutes les étapes du flux de travail : ingestion de contenu de formats multiples, transcodage et conditionnement pour des rendus et des formats multiples nécessaires à la lecture multiplateforme et au DRM multiplateforme, et diffusion en continu à débit binaire adaptatif pour le bureau, le web mobile, les applications mobiles et les téléviseurs connectés.

Bien que nous soutenions le concept de normalisation, nous n'en sommes pas encore au point où nous pouvons renoncer à tout autre support en faveur d'un scénario MPEG-DASH de bout en bout. Comme MPEG-DASH ne prend pas en compte toute l'étendue et la profondeur de l'écosystème vidéo, une adoption précoce pourrait conduire à une dépendance vis-à-vis des fournisseurs ou à un verrouillage, ce qui serait préjudiciable à nos clients.

En fin de compte, nous espérons que MPEG-DASH et les fournisseurs de l'écosystème amélioreront rapidement leurs capacités afin d'offrir plus de flexibilité aux éditeurs plutôt que d'imposer une implémentation propriétaire qui entraîne une dépendance vis-à-vis des fournisseurs ou une implémentation incomplète de la norme. En attendant, nous retroussons nos manches et mettons nos doigts sur des mots-clés pour travailler sur notre rôle numérique au sein de l'écosystème MPEG-DASH.

VIDEO.JS 4.0 AMÉLIORE LES PERFORMANCES ET LA STABILITÉ

bsp-admin-1 on May 9, 2013

Video.js 4.0 est sorti en 2013 et était disponible en téléchargement sur Github et hébergé gratuitement sur notre CDN. Pour rappel, Video.js est un lecteur vidéo HTML5 open source créé par l'équipe de Zencoder, rachetée par Brightcove en 2012.

Video.js a bouleversé le marché de la technologie des lecteurs vidéo open source et a connu une adoption et une part de marché considérables en l'espace de quelques années seulement. Le lecteur gratuit Video.js a été utilisé par des dizaines de milliers d'organisations, dont Montblanc, Dolce & Gabbana, Diesel, Illy, Applebee's, Mattel, Kellogg's, Les Echos, l'US Navy, Aetna, Transamerica, Washington State University, et bien d'autres.

La version 4.0 a bénéficié de la plus grande collaboration de la communauté, ce qui témoigne de la force croissante de la communauté JavaScript, de la popularité grandissante de la vidéo HTML5 et de l'augmentation de l'utilisation de Video.js. Entre 2012 et 2013, le nombre de sites utilisant Video.js a plus que doublé, et chaque mois, plus de 200 millions de visites sont enregistrées rien que sur la version hébergée par le CDN.

Video.js 4.0 comporte de nombreuses nouveautés.

  • Amélioration des performances grâce à une réduction de la taille de 18 % en utilisant Google Closure Compiler en mode avancé.
  • Une plus grande stabilité grâce à une suite de tests automatisés multi-navigateurs/appareils utilisant TravisCI, Bunyip et Browserstack.
  • Nouvelle interface et liste de plugins pour étendre Video.js
  • Nouvel habillage par défaut qui utilise des icônes de police pour une meilleure personnalisation
  • Conception réactive et prise en charge de l'affichage rétina
  • Amélioration de l'accessibilité grâce à une meilleure prise en charge de l'ARIA
  • Passage à la licence Apache 2.0
  • Ensemble d'outils de développement JavaScript à 100 %, y compris Grunt

2013 sera une année passionnante pour Video.js, avec davantage d'améliorations au niveau des performances, de la stabilité multiplateforme et de la personnalisation par le biais de plugins et d'habillages. Les membres de la communauté ont déjà commencé à travailler sur des plugins pour certaines des fonctionnalités les plus demandées, comme les listes de lecture, les analyses et la publicité.

7 meilleures pratiques de référencement vidéo qui génèrent du trafic

bsp-admin-1 on April 16, 2013

Vous cherchez à améliorer le référencement de vos vidéos et à augmenter le trafic sur votre site ? Voici 7 conseils rapides qui peuvent vous aider.

1. Rédigez le titre et la description de votre vidéo pour les internautes

Google accorde de l'importance à "l'écriture pour les gens" et désapprouve l'insertion de mots-clés dans le titre et la description de votre vidéo. Veillez à rédiger des titres et des descriptions attrayants et pertinents pour votre public, et non des mots-clés.

2. Ajouter des balises si vous avez un plan de site vidéo

L'ajout de balises à vos vidéos est un excellent moyen d'organiser le contenu au sein de la plate-forme vidéo en ligne Brightcove et peut contribuer au référencement, mais uniquement si vous disposez d'un plan du site vidéo qui expose ces balises aux moteurs de recherche. Si vous disposez des ressources de développement nécessaires pour créer un plan du site vidéo simple, l'investissement en vaut la peine.

3. Utiliser le balisage Schema

Schema est une collection de balises HTML que les webmasters peuvent utiliser pour baliser leurs pages d'une manière reconnue par les principaux moteurs de recherche. Les moteurs de recherche s'appuient sur ces balises de schéma pour améliorer l'affichage de leurs résultats de recherche, ce qui permet aux internautes de trouver plus facilement les bonnes pages web. Si vous utilisez l'attribut itemscope pour identifier votre contenu en tant que vidéo auprès des moteurs de recherche, vous augmenterez vos résultats en matière de référencement. Schema explique comment utiliser l'attribut itemscope et donne des instructions générales sur l'utilisation des balises html pour identifier les vidéos.

4. Choisir des vignettes de qualité

La qualité rédactionnelle de votre vignette l'emporte sur la qualité de l'image. En d'autres termes, le choix de vignettes attrayantes pour votre contenu peut augmenter le nombre de clics des utilisateurs. Un engagement plus important de la part des utilisateurs aura une incidence sur vos résultats en matière de référencement. Il convient également de noter qu'une vignette d'image obtiendra toujours de meilleurs résultats en termes de trafic qu'une icône vidéo générique ou qu'un lien textuel "cliquez ici pour la vidéo".

5. Incorporer les principaux termes de recherche qui renvoient des résultats vidéo

Bien qu'il ne faille pas "bourrer de mots-clés" le titre et la description de votre vidéo, certains mots augmenteront vos chances d'être trouvés par les moteurs de recherche. Des mots comme "vidéo", "show", "how to", "review" et "about" sont tous des termes clés qui augmentent la probabilité que votre contenu renvoie un résultat sous forme de vignette vidéo. Ne faites rien de non naturel, mais si vous pouvez incorporer ces mots dans votre titre ou votre description (par exemple, "Visite vidéo de l'Aloft Brooklyn"), cela peut faire la différence.

6. Optimisez votre site web

Le référencement vidéo le plus parfait ne sert à rien si votre site n'est pas optimisé. Il est toujours préférable de s'assurer que le référencement de votre site est optimisé avant de modifier les paramètres de vos vidéos.

7. Placer les vidéos en haut de la page

Si vous avez une vidéo, placez-la en haut de la page. Cela permet aux moteurs de recherche de comprendre qu'il s'agit d'un contenu vidéo. Il est étonnant de voir les résultats que vous obtiendrez grâce à ce petit changement.

MANIFESTES DYNAMIQUES ET FLEXIBILITÉ DES LISTES DE LECTURE HLS

bsp-admin-1 on March 28, 2013

Pendant des années, il y a eu deux modèles de base pour la diffusion en continu sur l'internet : la technologie propriétaire basée sur le serveur, comme le RTMP, ou le téléchargement progressif. La diffusion en continu sur serveur permet de fournir des flux à plusieurs débits qui peuvent être commutés à la demande, mais elle nécessite un logiciel coûteux pour l'obtention d'une licence. Le téléchargement progressif peut se faire via Apache, mais le changement de débit nécessite l'arrêt de la lecture.

L'avènement des protocoles de diffusion en continu basés sur HTTP, tels que HLS et Smooth Streaming, a rendu possible la diffusion en continu sur des connexions HTTP standard à l'aide d'une technologie de serveur de base telle qu'Apache ; la commutation transparente du débit binaire est devenue courante et la diffusion par CDN était simple, car elle était fondamentalement identique à la diffusion de n'importe quel fichier par HTTP. La diffusion en continu par HTTP n'est rien de moins qu'une révolution dans la diffusion de médias en continu, réduisant considérablement le coût et la complexité de la diffusion en continu de haute qualité.

Lors de la conception d'une plateforme vidéo, d'innombrables éléments doivent être pris en compte. Cependant, l'une des décisions les plus importantes et les plus souvent négligées concerne le traitement des fichiers manifestes basés sur HTTP.

Fichiers manifestes statiques

Dans le monde physique, lorsque vous achetez une vidéo, vous regardez l'emballage, vous prenez la boîte, vous vous rendez à la caisse, vous payez le caissier, vous rentrez chez vous et vous insérez la vidéo dans votre lecteur.

La plupart des plateformes vidéo sont structurées de manière assez similaire. Fondamentalement, un groupe de métadonnées (la boîte) est associé à un élément multimédia lisible (la vidéo). La plupart des plates-formes vidéo commencent avec le concept d'une URL unique qui relie les métadonnées à une seule vidéo mp4. Lorsqu'une plateforme vidéo devient plus complexe, il peut y avoir plusieurs URL connectées aux métadonnées représentant plusieurs débits binaires, résolutions ou éventuellement d'autres médias associés à l'élément principal, tels que des aperçus ou des fonctions spéciales.

Les choses se compliquent lorsqu'on essaie d'étendre le modèle physique à un monde de streaming en ligne qui inclut des protocoles de streaming basés sur HTTP tels que HLS. HLS est basé sur de nombreux fragments d'un fichier vidéo liés entre eux par un fichier texte appelé manifeste. Lors de la mise en œuvre du protocole HLS, la méthode la plus simple consiste à ajouter une URL qui renvoie au manifeste ou au fichier m3u8. Cette méthode a l'avantage d'être extrêmement simple et de s'inscrire dans le modèle existant.

L'inconvénient est que la HLS ne ressemble pas vraiment à un média statique. Par exemple, un MP4 ressemble beaucoup à une piste vidéo sur un DVD ; il s'agit d'une seule vidéo à une résolution et un débit uniques. Le manifeste HLS se compose très probablement de plusieurs débits binaires, résolutions et de milliers de morceaux de vidéo fragmentés. HLS a la capacité de faire beaucoup plus qu'un MP4, alors pourquoi le traiter de la même manière ?

Listes de lecture HLS

Une liste de lecture HLS comprend des métadonnées qui décrivent les éléments de base du flux et un ensemble ordonné de liens vers des fragments de la vidéo. En téléchargeant chaque fragment ou segment de la vidéo et en les lisant dans l'ordre, l'utilisateur peut regarder ce qui semble être une seule vidéo continue.

  • EXTM3U
  • #EXT-X-PLAYLIST-TYPE:VOD
  • #EXT-X-TARGETDURATION:10
  • #EXTINF:10,
  • file-0001.ts
  • #EXTINF:10,
  • file-0002.ts
  • #EXTINF:10,
  • file-0003.ts
  • #EXTINF:10,
  • file-0003.ts
  • #EXT-X-ENDLIST

Voici une liste de lecture m3u8 de base. Elle renvoie à quatre segments vidéo. Pour générer ces données par programme, il suffit d'indiquer le nom du fichier du premier élément, la durée cible des segments (dans ce cas, 10) et le nombre total de segments.

Manifeste HLS

Un manifeste HLS est une série non ordonnée de liens vers des listes de lecture. Il y a deux raisons d'avoir plusieurs listes de lecture : pour fournir différents débits binaires et pour fournir des listes de lecture de sauvegarde. Voici une liste de lecture typique où chaque .m3u8 est un lien relatif vers une autre liste de lecture HLS.

  • #EXTM3U
  • #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=2040000
  • fichier-2040k.m3u8
  • #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1540000
  • fichier-1540k.m3u8
  • #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1040000
  • fichier-1040k.m3u8
  • #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=640000
  • fichier-640k.m3u8
  • #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=440000
  • fichier-440k.m3u8
  • #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=240000
  • fichier-240k.m3u8
  • #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=64000
  • fichier-64k.m3u8

Les listes de lecture ont des débits et des résolutions variables afin d'assurer une lecture fluide quelles que soient les conditions du réseau. Pour générer un manifeste, il suffit de connaître les débits binaires de chaque liste de lecture et leurs chemins d'accès relatifs.

Remplir les blancs

Il existe de nombreuses autres informations importantes qu'une plateforme de vidéo en ligne doit capturer pour chaque ressource vidéo encodée : le codec vidéo, le codec audio, le conteneur et le débit binaire total n'en sont que quelques-unes. Les données stockées pour un seul élément vidéo doivent être significatives pour le spectateur (description, classement, distribution), significatives pour la plateforme (durée, vues, engagement) et significatives pour les applications (format, résolution, débit binaire). Grâce à ces données, vous permettez au spectateur de décider ce qu'il veut regarder, au système de décider comment programmer et à l'application de décider comment lire.

En saisissant les données nécessaires à la génération programmatique d'une liste de lecture, d'un manifeste et des informations sur les codecs pour chacune des listes de lecture, il devient possible de disposer d'un système dans lequel les manifestes et les listes de lecture sont générés par demande.

Exemple - La première liste de lecture

La spécification HLS détermine que la liste de lecture qui vient en premier dans le manifeste sera la première à être lue. Dans l'exemple de la section précédente, le premier élément de la liste était également la piste de meilleure qualité. Cela convient aux utilisateurs disposant d'une connexion internet rapide et stable, mais pour les personnes disposant d'une connexion plus lente, la lecture mettra un certain temps à démarrer.

Il serait préférable de déterminer si l'appareil semble disposer d'une bonne connexion internet, puis de personnaliser la liste de lecture en conséquence. Heureusement, grâce à la génération de manifestes dynamiques, c'est exactement ce que le système est conçu pour accomplir.

Pour les besoins de cet exercice, supposons qu'une demande de manifeste soit faite avec un tableau ordonné de débits binaires. Par exemple, la requête [2040,1540,1040,640,440,240,64] renverrait une liste de lecture identique à celle de la section précédente. Sur iOS, il est possible de déterminer si l'utilisateur est en connexion WiFi ou cellulaire. Étant donné que des données ont été saisies sur chaque liste de lecture, notamment le débit binaire, la résolution et d'autres paramètres de ce type, une application peut décider intelligemment de la manière d'ordonner le manifeste.

Par exemple, on peut déterminer qu'il est préférable de commencer entre 800-1200kbps si l'utilisateur est en WiFi et entre 200-600kbps si l'utilisateur est en connexion cellulaire. Si l'utilisateur est en WiFi, l'application demandera un tableau qui ressemblera à quelque chose comme : [1040,2040,1540,640,440,240,64]. Si l'application ne détecte qu'une connexion cellulaire, elle demandera [440,2040,1540,1040,640,240,64].

Exemple - Le dispositif hérité

Sur Android, la prise en charge de la vidéo est un peu une boîte noire. Pendant des années, la documentation officielle d'Android n'a pris en charge que les vidéos mp4 h.264 de 640×480, même si certains modèles pouvaient prendre en charge le 1080p. Dans le cas de HLS, le support est encore plus fragmenté et difficile à comprendre.

Heureusement, Android est dominé par une poignée d'appareils de premier plan. Grâce aux manifestes dynamiques, l'application peut non seulement cibler la meilleure liste de lecture pour commencer, mais aussi exclure les listes de lecture jugées incompatibles.

Étant donné que nos éléments multimédias capturent également des données telles que la résolution et les informations sur le codec, l'assistance peut être ciblée sur des appareils spécifiques. Une application pourrait décider d'envoyer tous les rendus : [2040,1540,1040,640,440,240,64]. Ou bien, un appareil plus ancien qui ne prend en charge que les images jusqu'à 720p pourrait supprimer le rendu le plus élevé : [1540,1040,640,440,240,64]. En outre, au-delà du monde des appareils mobiles, si l'application est une télévision connectée, elle pourrait supprimer les rendus de qualité inférieure : [2040,1540,1040,640].

Dynamique ou statique

Le choix d'un modèle de manifeste statique est parfaitement acceptable. Une certaine flexibilité est perdue, mais il n'y a rien de mal à la simplicité. De nombreux cas d'utilisation, en particulier dans le monde du contenu généré par l'utilisateur, ne requièrent pas le degré de complexité qu'implique la génération dynamique ; cependant, la génération dynamique de manifestes ouvre de nombreuses portes à ceux qui sont prêts à franchir le pas.

La façon dont les manifestes sont traités aura un impact significatif sur la flexibilité à long terme d'une plateforme vidéo, et c'est un point qui doit être discuté avec votre spécialiste de la compression.

TÉLÉCHARGEMENT ET ENCODAGE DE VIDÉOS À L'AIDE DE FILEPICKER

bsp-admin-1 on March 20, 2013

L'une des questions les plus fréquentes que nous posent les nouveaux clients est de savoir comment télécharger des vidéos. Pour les développeurs, la mise en œuvre des téléchargements de fichiers est quelque chose qu'ils ont probablement fait plusieurs fois, mais c'est toujours un problème.

Entrer dans Filepicker

Filepicker (désormais Filestack) facilite le téléchargement de fichiers. Vraiment facile. Vous n'êtes pas non plus limité aux fichiers locaux ; l'application prend en charge un large éventail de sources, de Dropbox à Google, en passant par l'enregistrement d'une vidéo directement à partir de votre webcam. Le plus beau, c'est que vous pouvez faire tout cela sans jamais quitter le front-end.

Avant toute chose, vous devez créer un compte Filepicker. Une fois que vous l'avez fait, créez une nouvelle application dans votre tableau de bord s'il n'y en a pas. Prenez note de la clé API que vous voyez, nous l'utiliserons plus tard. Filepicker est assez sympathique pour fournir un seau S3 pour commencer, mais prenez une seconde pour configurer un seau S3 de destination pour vos téléchargements.

Commençons par la même page avec un modèle HTML5 de base. Nous allons utiliser jQuery pour simplifier les choses, nous l'inclurons donc dans notre modèle ainsi que la bibliothèque Filepicker.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Zencoder Dropzone</title>

    <!-- jQuery Include -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

    <!-- Filepicker.io Include -->
    <script type="text/javascript" src="//api.filepicker.io/v1/filepicker.js"></script>
</head>

<body>
    <div id="content">
        <h1>Upload all the things!</h1>
    </div>
</body>
</html>

Nous pouvons maintenant utiliser l'API JavaScript Filepicker pour permettre à nos utilisateurs de sélectionner un fichier et de l'enregistrer dans notre panier S3. Nous devrons également associer cela à un lien dans le corps de la page pour que l'utilisateur ait quelque chose à cliquer. Ajoutez ceci sous l'inclusion JavaScript Filepicker. Commençons par ajouter le lien de téléchargement. Puisque nous avons déjà un grand et proéminent h1 il suffit d'ajouter le lien vers cette étiquette.

<h1><a href="#" id="upload-link">Upload all the things!</a></h1>

Nous voulons maintenant utiliser ce lien pour déclencher filepicker.pickAndStore lorsqu'on clique dessus. C'est ici que nous utiliserons la clé API que vous avez notée plus tôt. Placez cet extrait sous l'inclusion JavaScript Filepicker dans l'en-tête de la page.

<script type="text/javascript">
    $(function() {
      filepicker.setKey('The_Key_From_Your_Dashboard');

      $('a').click(function(e) {
        e.preventDefault(); // This keeps the normal link behavior from happening

        filepicker.pickAndStore({},{location: 's3'},function(fpfiles){
            console.log(JSON.stringify(fpfiles));
        });
      });
    });
</script>

Vous devrez utiliser une sorte de serveur web pour servir le HTML, sinon vous ne pourrez pas charger les fichiers JavaScript externes. Vous pouvez utiliser quelque chose comme http-server, mais il existe une application Node basique qui servira les fichiers statiques dans le dépôt GitHub.

Choisissez n'importe quel fichier (vous pouvez choisir quelque chose de relativement petit) et téléchargez-le. Pour l'instant, un téléchargement réussi ne fait qu'enregistrer le fichier fpfiles à la console, donc après avoir téléchargé un fichier, jetez un coup d'œil à la console. Si tout s'est déroulé comme prévu, vous devriez avoir un objet contenant des informations sur le fichier que vous venez de télécharger.

Vous venez de télécharger un fichier depuis votre ordinateur avec seulement 27 lignes de code au total, y compris un simple balisage HTML. Cependant, il n'est pas utile de simplement télécharger des fichiers et de les laisser là, alors faisons en sorte que les utilisateurs puissent télécharger des vidéos et les encoder.

Ajout de Zencoder

Tout d'abord, modifions notre téléchargeur pour qu'il n'accepte que les fichiers vidéo. Filepicker nous permet de restreindre par mimetype, donc si vous êtes comme moi, vous pourriez être tenté d'essayer {mimetype: 'video/*'}. Cela fonctionnera parfaitement dans Chrome, mais les utilisateurs de Safari verront un sous-ensemble beaucoup plus restreint de fichiers qu'ils peuvent télécharger. Pour les vidéos, il est beaucoup plus fiable d'imposer une restriction par extension, c'est pourquoi nous avons opté pour cette solution.

$('a').click(function(e) {
  e.preventDefault(); // This keeps the normal link behavior from happening
  var acceptedExtensions = ['3g2','3gp','3gp2','3gpp','3gpp2','aac','ac3','eac3','ec3','f4a','f4b','f4v','flv','highwinds','m4a','m4b','m4r','m4v','mkv','mov','mp3','mp4','oga','ogg','ogv','ogx','ts','webm','wma','wmv'];
  filepicker.pickAndStore({extensions: acceptedExtensions},{location: 's3'},function(fpfiles){
      console.log(JSON.stringify(fpfiles));
  });
});

Vous pouvez restreindre cet ensemble de fichiers acceptés ou en ajouter d'autres, mais j'ai choisi la solution de facilité en utilisant la liste des formats de sortie valides de la documentation sur les formats de Zencoder. Cela inclut quelques fichiers audio, mais comme Zencoder supporte l'encodage audio uniquement, nous pouvons les laisser là. Maintenant, si vous cliquez sur le lien et parcourez vos fichiers locaux, vous devriez remarquer que vous ne pouvez sélectionner que les fichiers avec une extension dans la liste. Si vous essayez de glisser-déposer un fichier inacceptable, vous obtiendrez une erreur.

Maintenant que nous savons que nous ne téléchargerons que des fichiers que Zencoder peut prendre en charge, faisons en sorte qu'un téléchargement réussi envoie le fichier à Zencoder pour qu'il soit encodé. Avant cela, nous devons définir notre clé API Zencoder. Vous pouvez l'inclure juste en dessous de votre clé Filepicker.

filepicker.setKey('The_Key_From_Your_Dashboard');
var zenKey = 'Zencoder_API_Key';

Nous allons maintenant utiliser la fonction $.ajax pour envoyer notre demande d'API à Zencoder en cas de téléchargement réussi.

filepicker.pickAndStore({extensions: acceptedExtensions},{location: 's3'},function(fpfiles){
  // This is the simplest Zencoder API call you can make. This will output an h.264 mp4 with AAC audio and
  // save it to Zencoder's temporary storage on S3.
  var request = {
    "input": fpfiles[0].url
  }
  // Let's use $.ajax instead of $.post so we can specify custom headers.
  $.ajax({
      url: 'https://app.zencoder.com/api/v2/jobs',
      type: 'POST',
      data: JSON.stringify(request),
      headers: { "Zencoder-Api-Key": zenKey },
      dataType: 'json',
      success: function(data) {
        $('body').append('Job created! <a href="https://app.zencoder.com/jobs/'+ data.id +'">View Job</a>')
      },
      error: function(data) {
        console.log(data);
      }
  });
});

Actualisez maintenant votre page et téléchargez une vidéo. Si tout s'est déroulé comme prévu, vous devriez voir apparaître un message de réussite avec un lien vers votre emploi nouvellement créé.

Seulement 47 lignes de code plus tard, vous avez une page web qui vous permet de télécharger une vidéo et de l'envoyer pour encodage.

Notes et avertissements

C'est une mauvaise idée de mettre votre clé d'API Zencoder en texte clair à l'intérieur de JavaScript. Répétons-le encore une fois : Ne l'utilisez pas dans un code auquel d'autres personnes pourraient avoir accès. Rien n'empêcherait les gens de prendre votre clé API et d'encoder toutes les vidéos qu'ils veulent.

Une bien meilleure idée serait d'utiliser Filepicker comme décrit mais de faire l'appel à l'API de Zencoder dans votre back-end où votre clé API est à l'abri des regards indiscrets.

Aller plus loin

Le glisser-déposer est vraiment cool, c'est pourquoi nous avons voulu créer une page entière qui utilise les fonctions de Filepicker. makeDropPane. Les utilisateurs doivent entrer leur clé API avant de faire quoi que ce soit et celle-ci n'est pas stockée dans le code. démo peut être mis en ligne en toute sécurité.

Cette version valide la clé API, inclut un historique de vos derniers travaux Zencoder et vous permet de modifier le modèle de demande. Tous ces paramètres sont enregistrés dans le localStorage de votre navigateur afin que vous ne perdiez pas tout lors d'une actualisation.