En un post anterior ya vimos como leer un XML con JavaScript. Vimos que no era muy complicado hacerlo - también hemos de tener en cuenta que era un XML muy sencillito, pero visto uno…vistos todos ;) -.

Peeeero, hay un inconveniente. Y es que si intentamos cargar un XML que no sea local (es decir que el XML y el JavaScript no estén en el mismo servidor), nos va a dar un error del XMLHTTP algo así como:

‘Error: uncaught exception: Permiso denegado al llamar al método XMLDocument.load’.

¿Cómo lo solventamos? Fácil, necesitamos un archivo aparte que se encarge de leer el contenido del archivo XML del RSS. En nuestro caso vamos a usar PHP para hacer esta función.

1.- Crearemos una variable que contendrá la dirección url del RSS que le pasaremos por GET o por POST, es indiferente. Por eso usamos la variable global $_REQUEST.
2.- Indicaremos las headers al archivo resultante como del tipo texto plano/xml. ‘text/xml’. Si no lo hacemos, el contenido el archivo RSS nos lo mostrará como texto simple sin formato xml.
3.- Leeremos el contenido del archivo

<?
$url = $_REQUEST['url'];
header("Content-type: text/xml");
readfile ($url);
?>

Una vez que hemos podido leer el contenido del archivo RSS, nuestro fichero PHP devolverá al JavaScript este resultado, que aprovecharemos para parsear como si se tratara de un XML normal y corriente.

Usaremos una función ‘puente’ que recogerá la URL pasada como parámetro, la concatenará al nombre del archivo PHP y esa cadena resultante se mandará a la funcion JavaScript que creará los objetos XMLHTTP.

function loadRSS(url){
    crearObjetoXML("readRSS.php?url="+url);
}

La función ‘crearObjetoXML’ tendrá el siguiente código:

function crearObjetoXML(archivoXML){
    //--- Compruebo si se trata de IE o no.
    //--- Si es IE el objeto ActiveXObject existirá.
    if(window.ActiveXObject){
        //--- Creo un nuevo objeto de la librería Microsoft.XMLDOM que es la que se encarga
	//--- en Internet Explorer de 'parsear' un archivo XML.
	xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
	//--- Defino la asincronización a false
	xmlDoc.async = false;
	xmlDoc.load(archivoXML);
	parsearXML();
    }else if(document.implementation && document.implementation.createDocument){
	xmlDoc = document.implementation.createDocument("","",null);
	xmlDoc.load(archivoXML);
	//--- Le decimos que cuando haya terminado de cargar el XML
	//--- ejecute la función de parsear el mismo.
	//--- NOTA: Se le llama a la función sin los paréntesis. Si se le colocan no funciona
	xmlDoc.onload = parsearXML;
    }else{
	alert ('Su navegador no puede soportar este script');
    }
}

Como vemos creamos el objeto XML dependiendo del navegador que se utilice (IE o Mozilla), cargamos el archivo XML (que recordemos que se lo hemos pasado por parámetro) y con ‘onLoad’ detectamos cuando ha sido cargado y en ese caso llamamos a la funcion ‘parsearXML’.

Tal y como su nombre indica, ‘parsearXML’ se encargará de recorrer el archivo RSS, analizarlo y mostrarlo por pantalla.

1. - Definimos una variable contenido que hará referencia al div ‘contenido’ de nuestro HTML. Ahí es donde cargaremos los datos que leamos.

var contenido = document.getElementById('contenido');
contenido.innerHTML = 'Cargando RSS...';

2.- Definimos una variable ‘versionRSS’ a la que se le asignará la version RSS del documento y después comprobaremos si es ‘2.0′ y si lo es, podremos parsear el RSS. (Como se habrá deducido, hemos optado solo -de momento- por parsear los RSS con al menos esta version)

var versionRSS = xmlDoc.getElementsByTagName('rss')[0].getAttribute('version');
if(versionRSS == "2.0"){
    var versionOk = true;
}else{
    var versionOk = false;
}

3.- Si la version es la 2.0, procedemos a extraer los datos. (versionOk == true)
Definimos una variable ‘elementos’, otra para el número total de estos, y alguna más para guardar el título, el link, la fecha de publicacion y el resumen.
Después solo falta asignar estos valores, concatenados al div ‘contenido’

if(versionOk){
    var entradas = xmlDoc.getElementsByTagName("item");
    var numEntradas = entradas.length;
    var tituloEntrada = '';
    var descEntrada = '';
    var linkEntrada = '';
    contenido.innerHTML = '';
    for(var i=0;i<numentradas;i++){
        tituloEntrada = entradas[i].getElementsByTagName("title")[0].firstChild.nodeValue;
	descEntrada = entradas[i].getElementsByTagName("description")[0].firstChild.nodeValue;
	linkEntrada = entradas[i].getElementsByTagName("guid")[0].firstChild.nodeValue;
	fechaEntrada = entradas[i].getElementsByTagName("pubDate")[0].firstChild.nodeValue;
	contenido.innerHTML += '<h3><a href="'+linkEntrada+'" target="_blank">'+tituloEntrada+'</a><h5>'+fechaEntrada+'</h5>'+descEntrada+'<br /><br/>';
    }
}