Descargar vídeos de EITB.com de forma manual

Hace unos días @epyblast me decía por twitter que no veía como lograba descargar vídeos de eitb.com así que me he decidido a hacer un pequeño tutorial.

Cuando estamos en la página de un vídeo, como por ejemplo: http://www.eitb.com/es/videos/detalle/732385/muy-escepticos-medicinas-alternativas-efecto-placebo/ podemos mirar el código HTML y no encontraremos ninguna referencia al objeto flash que reproduce el vídeo. ¿Magia? Casi, las artes obscuras del JavaScript.

En lugar de tener el reproductor flash en el código HTML, lo crean desde el JavaScript, por lo que en el HTML nos encontraremos algo así:

<div id="detalle_video_732385">
     <script type="text/javascript">insertar_player_video(732385, 552, 305, true, 1316436720, 'detalle_video');</script>
</div>

La función “insertar_player_video” la importan en el header del documento:

<script src="/resources/js/general.js" type="text/javascript"></script>

Si miramos ese fichero, veremos que la función en cuestión es:

function insertar_player_video(id, width, height, autostart, fecha_mod, key_modulo, ocultarsocial){
    var size = 'dest_2';
	if(width > 400){
		size = 'grande';
	}
    autostart = (autostart) ? 'autostart' : ''; 
	if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))){
        $.getJSON('es/get/multimedia/video_json/id/'+id+'/size/'+size+'/f_mod/'+fecha_mod, function(data) {
            $('#'+key_modulo+'_'+id).html('<video id="video_'+id+'" width="'+width+'" height="'+height+'" poster="'+data.THUMBNAIL+'" controls '+autostart+'><source src="'+data.FILE_MP4+'" type="video/mp4" /></video>')
        });
    }else{
    	if(!ocultarsocial) ocultarsocial = 0;
 
    	var params = {
            wmode : 'opaque',
            allowfullscreen : true,
            allowscriptaccess : 'always'
        };
    	var idioma = get_idioma();
        var flashvars = {
            id : key_modulo+'_'+id,
            idioma : get_idioma(),
    	    playlistfile : '/'+idioma+'/get/multimedia/video/id/'+id+'/size/'+size+'/f_mod/'+fecha_mod,
    	    skin : '/resources/flash/skins/eitb.zip',
    	    fullscreen: true,
    	    tipo : 'video',
    	    autostart: autostart,
    		ocultarsocial: ocultarsocial,
            stretching: 'uniform'
        };
        swfobject.embedSWF(
            '/resources/flash/video_player.swf',
            key_modulo+'_'+id,
            width,
           	height,
            "9.0.0",
            null,
            flashvars,
            params,
            null);
    }
 
    return false;
}

De todo ese trozo, realmente nos interesan muy pocas líneas:

    var size = 'dest_2';
	if(width > 400){
		size = 'grande';
	}
    autostart = (autostart) ? 'autostart' : '';
	if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))){
        $.getJSON('es/get/multimedia/video_json/id/'+id+'/size/'+size+'/f_mod/'+fecha_mod, function(data) {
            $('#'+key_modulo+'_'+id).html('<video id="video_'+id+'" width="'+width+'" height="'+height+'" poster="'+data.THUMBNAIL+'" controls '+autostart+'><source src="'+data.FILE_MP4+'" type="video/mp4" /></video>')
        });

Veréis que comprueban mediante el user agent si somos un iDevice. Como sabréis, esos dispositivos no soportan Flash, así que lo más normal cuando se les detecta es redireccionarles a HTML5 y servirles el vídeo directamente (cosa que, sinceramente deberían hacer siempre…).

En ese código vemos que se realiza una petición JSON:

$.getJSON('es/get/multimedia/video_json/id/'+id+'/size/'+size+'/f_mod/'+fecha_mod

Si recordamos, la signatura de la función era:

function insertar_player_video(id, width, height, autostart, fecha_mod, key_modulo, ocultarsocial)

Y la llamada a la función:

insertar_player_video(732385, 552, 305, true, 1316436720, 'detalle_video');

Por lo que sabemos que: id=732385, width=552, height=305, autostart=true y fecha_mod=1316436720. Además el primer if hace que si width > 400, y en este caso lo es, size=grande.
Así pues, si rellenamos la url JSON con esos datos obtenemos: es/get/multimedia/video_json/id/732385/size/grande/f_mod/1316436720 Si completamos la URL obtenemos: http://www.eitb.com/es/get/multimedia/video_json/id/732385/size/grande/f_mod/1316436720/

Esa URL nos devuelve una cadena de texto en la que podemos observar lo siguiente:

"FILE_MP4":"http:\/\/www.eitb.com\/multimedia\/videos\/2011\/09\/08\/534876\/20110907_17023900_0004196908_001_001_TR__ESCEPTIC_20110908_115202.mp4"

Si eliminamos las ‘\’ que sobran obtendremos la URL del vídeo: http://www.eitb.com/multimedia/videos/2011/09/08/534876/20110907_17023900_0004196908_001_001_TR__ESCEPTIC_20110908_115202.mp4

Ahora ya podemos descargar el vídeo sin ningún problema :D Sherlock Downloader automatiza el proceso dándote directamente la URL del vídeo, pero nunca está demás saber que está pasando por debajo ;)

About the Author

Me llamo Pablo Carballude González, soy graduado en computación con master en HCI y Seguridad Informática. Actualmente trabajo para Amazon en Seattle como Software Developer Engineer. Soy de esas personas que no saben si los textos autobiográficos deben ser en primera o tercera persona. Lo intenté en segunda, pero no le entendí nada :P