usando facebook video

Una de mis pasiones consiste en la subida de gameplays de juegos a internet y ello me ha llevado a probar casi todos los servicios de streaming de vídeo que existen. La primera opción siempre fue Youtube, por razones obvias: Fue el servicio que mejor supo evolucionar, tiene la mayor comunidad de usuarios y nunca tuvo restricciones de ningún tipo (quitando los derechos de autor). Los que sigan el blog sabrán que lo mío con Youtube es una relación de amor/odio que nunca ha llegado a buen puerto. También sufrí decepciones con la mafia de blip.tv y cantidad de servicios más. La ventaja de Youtube es que, en realidad, no existe nada mejor que Youtube. El problema de Youtube es que, primero, nunca sabes cuánto durará el vídeo o la cuenta, segundo, la calidad de las conversiones tiene una relación tamaño/calidad inaceptable debido al uso del perfil 'main' de AVC y una conversión de dolorosa ineficacia

Facebook Video

Pero entonces entró en juego el host oficial de la red social más famosa del mundo: Facebook (link). En un principio no ofrecía nada interesante ya que la calidad de las conversiones era horrorosa, tenía muchas limitaciones y solo permitía subir 2 miserables minutos como máximo. Sin embargo hace alrededor de un año actualizaron el servicio permitiendo la subida de 20 minutos y ofreciendo la mejor calidad de conversión que se haya visto en un servicio de streaming web. Facebook Video NO (recalco) es un sistema de distribución de vídeo, es un complemento para una red social, y como tal resulta complicado usarlo para distribuir los vídeos que yo grabo. La gracia del asunto, descubierto a través de una página de anime hace meses (link), es que Facebook Video permite acceder a la dirección última de los vídeos, al hotlink. Esto a su vez permite usar algún reproductor de vídeo gratuito programado en Adobe Flash para integrar el vídeo en una página web


Como puntos negativos destacaría dos: Tiene bloqueado el hotlink a los navegadores Internet Explorer y Opera, con lo que la visualización de los vídeos en ellos es imposible, pero funciona sin problemas en Firefox, Chrome y Safari. El otro gran problema es que Facebook convierte los vídeos sin añadir frames de referencia en el streaming con lo que es imposible comenzar a hacer streaming de un vídeo por una determinada parte, si quieres ver el final el vídeo tiene que descargarse entero


Como ventajas: Es un servicio infinitamente más rápido que Youtube (por razones obvias), tiene una calidad de conversión mucho mejor (resulta ridículo compararlas) y el vídeo nunca puede ser borrado por denuncias ya que podemos acceder al hotlink aunque en las opciones de privacidad del mismo lo tengamos seleccionado para que tan solo nosotros podamos acceder a él, además FV no tiene ningún tipo de herramienta de detección de contenido debido al carácter de privacidad restringida del servicio, en otras palabras, es ridículo que intentes detectar una música de Ke$ha en un vídeo distribuido en un grupo de 20 amigos

JW FLV Player

Hay sobre unos 4 o 5 reproductores web gratuitos desarrollados en Adobe Flash que resultan interesantes pero es, sin duda, JW Flv Player (linK) el mejor de todos ellos, por varios motivos: Detecta la configuración del navegador activo y permite alternar entre un reproductor flash o un reproductor propietario usando la etiqueta de vídeo del HTML5, lo que permitirá su reproducción en dispositivos portátiles que no dispongan de flash (probado con este blog en un iPod Touch 2nd y funciona bien). Por otro lado es muy configurable, se puede cambiar totalmente el aspecto e incluso incluir gran cantidad de plugins con diversas funciones. Es liviano, no es el más liviano pero para todo lo que ofrece podemos considerar que está bien optimizado. Se actualiza constantemente con nuevas mejoras. Soporta listas de reproducción con gran cantidad de metadatos a elegir. Podría destacar numerosas ventajas más pero digamos que esas son las fundamentales con, por ejemplo, Flowplayer (link)

Subiendo el vídeo

Deberemos tener una cuenta de Facebook válida. ¿Qué significa esto?. Facebook restringe algunos aspectos del servicio a las cuentas nuevas (con las antiguas no pasa aunque no las hayas usado nada) que no se hayan autentificado mediante mensaje de texto. Y aunque paséis por el aro y les deis vuestro número de teléfono tampoco os va a resolver la vida porque las veces que lo he intentado nunca me ha funcionado. El problema en cuanto al servicio de vídeo con cuentas 'no válidas' es que seguimos teniendo la restricción de los 2 minutos de vídeo, el resto de cuentas ya tienen los 20 minutos de vídeo. Para saber qué cuenta tenemos es tan fácil como acceder a la sección de 'Vídeos' (link) y pinchar en el botón 'Cargar vídeo'. Debajo de la caja de selección encontraremos un texto. Ahí nos dirá si podemos subir 2 minutos o 20 minutos de vídeo


No os voy a hacer un tutorial de cómo subir un vídeo porque es A-B-C, lo único controlad las opciones de privacidad durante la subida para ver si queréis que sea público o si solo vosotros queréis acceder, a efectos de integración en el blog/web da lo mismo qué privacidad tenga en Facebook. El título, descripción y tags yo lo suelo dejar en blanco ya que, de esta manera, se les asigna automáticamente la fecha y la hora de la publicación del vídeo, así es más fácil localizarlo en base a la fecha de la entrada en el blog por si es necesario re-linkarlo o lo que sea. Una vez que haya subido el vídeo esperáis que se convierta, aquí no es como Youtube que la calidad 'fullera' aparece directamente y la 'buena' (jajaja) tarda más en convertirse, tanto una como otra tardan algo en convertirse

Consiguiendo los enlaces

Ahora que tenemos el vídeo preparado procederemos a conseguir los enlaces, tanto del vídeo en calidad 'baja', del vídeo en calidad 'alta' y de la miniatura (el thumbnail) que hayamos elegido para el vídeo. Esto se puede hacer en cualquier navegador ya que todos tienen un gestor de caché pero no tengo muy claro cómo es en el resto ni ganas de comprobarlo con lo que solo lo explicaré para Firefox. Primero accedemos a la ventana del vídeo elegido y posteriormente a la pestaña del navegador 'Herramientas' > 'Limpiar historial reciente', seleccionamos 'Todo' y solamente tildamos la caja de selección de 'Caché'. Esto vaciará completamente el caché del navegador. Volvemos a actualizar la ventana del vídeo hasta que se vea la captura de previsualización, a continuación, yo suelo visualizar primero en calidad normal 'Ver en calidad normal', esperáis que el vídeo se inicie y a continuación 'Ver en alta calidad, esperáis que el vídeo se inicie


Ahora solo queda entrar en el caché (link) y buscar (CTRL+F) las 3 cosas. Para la miniatura (el thumbnail) buscamos por 'vthumb', entrad en la dirección y comprobad que es la imagen correcta. Para los vídeos es algo más complicado, buscad por 'mp4'. Los vídeos pueden tener dos tipos de dirección, depende del vídeo, en la dirección de algunos nos encontraremos la cadena 'video.ak.fbcdn.net' y en otros la cadena 'video.l3.fbcdn.net', cualquier otra cosa no nos servirá, por ejemplo 'cfs-p1.l3.fbcdn.net'. En un mismo vídeo la calidad normal y la calidad alta tienen la misma cadena, ya sea 'ak' o 'l3', por lo que tendréis que buscar 2 enlaces en cada vídeo. ¿Cuál es cuál? (sin visualizarlo, claro), pues comprobar -accediendo a los enlaces- en el apartado 'last modified' el minuto/segundo de un vídeo y del otro, el primero será el que hayamos cargado el primero y el segundo el que hayamos cargado luego. En el caso de la miniatura copiad la dirección completa, en el caso de los vídeos copiad desde 'http://' hasta '.mp4', el resto no es necesario

Integrando el vídeo

Primero descargaremos el JW FLV Player (link) y subiremos los archivos 'swfobject.js' y 'player.swf' a un host, el 'yt.swf' también podemos subirlo si vamos a integrar vídeos de Youtube. Como host yo elegiría  Dropbox (link) ya que permite hotlink, es compatible con cualquier archivo y es bastante más rápido que Google Sites o similares. Si usáis Dropbox tendréis que subirlo a la carpeta 'Public' (obviamente). Yo tengo los archivos metidos en ella directamente y las listas de reproducción en una sub-carpeta llamada 'Playlist' (muy original, sí). Hecho esto deberemos indicar a la página/blog la dirección del programa javascript que controla algunas funciones del reproductor. No es totalmente necesario el uso de este programa, pero sin él algunos parámetros no funcionarán. Para incluirlo solo deberemos copiar la URL del 'swfobject.js' y pegarla con el formato <script src='URL-del-swobject.js' type='text/javascript'/> en la cabecera del blog/web, es decir: entre <head> y </head>


Una vez hecho esto ya podemos integrar el vídeo. Para ello usaremos este formato:

<embed src="URL-player.swf" allowscriptaccess="always" allowfullscreen="true" flashvars="file=URL-vídeo-calidad-baja&amp;plugins=hd-1&amp;hd.file=URL-vídeo-calidad-alta&amp;controlbar=over&amp;image=URL-thumbnail" height="tamaño-vertical-vídeo" width="tamaño-horizontal-vídeo"></embed>

En este ejemplo estoy usando el plugin 'HD' que viene integrado en el propio reproductor y que nos permitirá a través de un botón cambiar entre una calidad y otra. Si queréis añadir más flashvars (características del reproductor) usad este configurador online (link). De esta manera habremos terminado y podremos visualizar el vídeo en la entrada correspondiente


Si queremos integrar una lista de reproducción usaremos este otro formato:

<embed src="URL-player.swf" allowscriptaccess="always" allowfullscreen="true" flashvars="file=URL-lista-reproducción.xml&amp;playlistsize=120&amp;playlist=bottom&amp;controlbar=over" height="tamaño-vertical-vídeo" width="tamaño-horizontal-vídeo"></embed>

La lista de reproducción tiene que estar en contenedor XML y en los siguientes formatos (link). El parámetro 'playlistsize' hace referencia al tamaño que tendrá la caja de selección de vídeos, independientemente al número de ellos, tened en cuenta el tamaño que le dais a esta caja de selección a la hora de dar el tamaño vertical del reproductor, es decir: Si el vídeo tiene una resolución vertical de 480px y la caja de selección son dos vídeos de 60px cada uno (120px en total), en la resolución vertical del reproductor debemos indicar 600px, sumando ambos elementos, tanto el vídeo como la caja de reproducción

Si no ha quedado lo suficientemente claro a continuación os dejo un vídeo-tutorial con un ejemplo bastante sencillo desde cero: Creando el blog, subiendo los archivos, consiguiendo la URL del vídeo e integrándolo en una entrada estándar. Lo que no muestro es cómo subo el vídeo pero doy por hecho que eso es de dominio público :-P


Mirror en Youtube (link)