Funciones para acceder a archivos del servidor con Javascript

  • Por
Algunas funciones interesantes para acceder al sistema de archivos del servidor desde scripts Javascript, basadas en las funciones file system de PHP.
En PHP existe un rico juego de funciones para acceder al sistema de archivos del servidor, que muchos de los lectores podrán conocer si están familiarizados con ese lenguaje de programación del lado del servidor. En el caso de Javascript, al tratarse de un lenguaje de programación del lado del cliente, los procesos para acceder al sistema de archivos del servidor son un poco distintos y necesitan utilizar la tecnología Ajax, lo que puede complicar un poco las cosas.

En este artículo, a modo de presentación de algunas de las posibilidades de las librerías php.js, comentadas anteriormente en DesarrolloWeb.com, vamos a mostrar cómo hacer uso de las funciones de PHP para el acceso al sistema de archivos del servidor, pero directamente desde Javascript. Esto lo podemos conseguir porque el mencionado proyecto php.js ha portado a Javascript cientos de funciones útiles existentes en PHP, entre las que hay muchas que trabajan con el sistema de archivos del servidor y que nos permiten acceder a muchos recursos del servidor, por medio de Ajax, pero sin necesitar conocer las complejidades inherentes a esos procesos ni la propia tecnología Ajax.

Así pues, simplemente tenemos que conocer las funciones PHP de acceso a los archivos del servidor y trabajar con ellas para recuperar cosas como si existe un fichero, con la función file_exists(), el contenido de texto completo de un archivo, con file_get_contents(), o el tamaño de un archivo en el disco del servidor, con filesize(). Estos son tres ejemplos sencillos de trabajo con las funciones del sistema de archivos de PHP en Javascript, que veremos en este artículo, pero existen otras muchas funciones útiles disponibles para los desarrolladores.

Nota: Para usar esas funciones necesitaremos acceder a la página del proyecto php.js y hacer la descarga de las funciones que deseemos utilizar. Para ello lo más cómodo, como se explicó anteriormente, es ir a la sección "Compile" y seleccionar las funciones de PHP que queremos usar desde Javascript. Entonces podremos descargar un paquete con las funciones que seleccionemos y todas aquellas que sean también requeridas para que todo marche correctamente.

Las funciones del sistema de archivos que dispone PHP son muy ricas y tenerlas a nuestra disposición desde Javascript es una verdadera gozada, así pues este sería un gran ejemplo de las destacables posibilidades que nos abren las librerías php.js.

Comprobar con Javascript si un archivo existe en el servidor

Comencemos probando una sencilla función para saber si existe, o no, un archivo en el servidor. Esta función de PHP, que podemos disponer ahora también en Javascript, se llama file_exists() y le tenemos que enviar como parámetro la URL del archivo que deseamos comprobar su existencia. Nos devolverá un boleano, indicando con true que sí existe el fichero y con false la no existencia.

var archivo = "server.js";
if(file_exists(archivo)){
   //podemos hacer cualquier cosa con ese fichero, porque sabemos que sí existe.
}

Nota: Para que funcione ese código y la función file_exists(), así como cualquier otra que acceda al sistema de archivos del servidor, necesitamos acceder a la página donde esté este código Javascript por http. Esto es porque se va a acceder por medio de Ajax a los archivos del servidor y para hacer las conexiones por Ajax la página necesita estar ejecutándose por medio de un servidor web. Esto lo podemos conseguir subiendo la página a un servidor de alojamiento del que dispongamos, o solicitando el archivo a través de un servidor web que podamos tener instalado en nuestro ordenador local.
Además, volvemos a remarcar que para que la función file_exists() funcione, así como cualquier otra de las librerías php.js, tendremos que haber descargado esas funciones en algún paquete desde el sitio de phpjs.org.

Recibir el tamaño en bytes de un archivo del servidor con Javascript

Otro ejemplo de tarea que podríamos hacer muy fácilmente con las librerías php.js es obtener el tamaño en disco de un archivo del servidor. Para ello utilizaremos la función filesize(), que funciona igual que su correspondiente versión de PHP.

var tamano = filesize("archivo-cualquiera.html');

Esto nos devuelve el tamaño en bytes, por lo que, si deseamos el tamaño en Kb tendremos que dividir el valor devuelto por 1024.

Leer el contenido completo de un archivo de texto del servidor con Javascript

Ahora veamos otra utilidad verdaderamente impresionante de estas librerías. Impresionante por funcionar de manera tan sencilla, a pesar de la complejidad de la tarea que se está solicitando. Se trata de acceder a un archivo de texto y recuperar todo su contenido en una variable.

Esto se hace en PHP por medio de la función file_get_contents(), que en su versión portada a Javascript funciona de la misma manera que en el lenguaje del servidor. Tenemos que llamar a la función pasándole la ruta del archivo cuyo contenido queremos recuperar y obtendremos como respuesta el texto completo que hay en ese fichero.

var texto_fichero = file_get_contents("archivo-solicitado.html");

Ejemplo completo de acceso al sistema de archivos del servidor con Javascript

Ahora podemos ver el código completo de un ejemplo de acceso al sistema de archivos del servidor, por medio de Javascript y Ajax, con las funciones de alto nivel que nos proporcionan las librerías php.js. En el ejemplo definimos una variable con una cadena que tiene el nombre de un archivo, comprobamos luego si existe ese fichero y en caso que exista, mostramos su tamaño en disco y su contenido de texto.

var archivo = "server.js";
if(file_exists(archivo)){
   //existe ese fichero
   document.write("<h2>El fichero " + archivo + " existe en el servidor</h2>");
   
   //voy a ver cuánto ocupa ese fichero
   var tamano = filesize(archivo);
   document.write("<h2>El fichero " + archivo + " ocupa " + (tamano/1024) + " Kb</h2>");
   
   //voy a traerme su contenido completo
   var texto_fichero = file_get_contents(archivo);
   document.write("<pre>" + texto_fichero + "</pre>");
}

Podemos ver ese ejemplo en marcha en una página aparte.

Autor

Miguel Angel Alvarez

Miguel es fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Comenzó en el mundo del desarrollo web en el año 1997, transformando su hobby en su trabajo.

Compartir

Comentarios

Enzo

02/9/2010
Seguridad
Si no entiendo mal, esto hace que los archivos del servidor sean vulnerables?

midesweb

02/9/2010
Acceso a archivos de servidor por Javascript los hace vulnerables?
Hola Enzo,

No entiendo por qué supones que por acceder a los archivos del servidor por Javascript éstos tengan que ser vulnerables.

En realidad no son ni más ni menos seguros porque los accedas desde Javascript. Lo que sí existe en el navegador es una restricción de seguridad por la cual sólo permite acceder a archivos del propio dominio donde estás programando en Javascript. Es decir, no podrás abrir archivos con Javascript que estén en otros dominios.

No sé si a eso te referías en tu anterior comentario.

Henry Jimenez Tellez

12/7/2011
No me funciona en Explorer
Lo he probado N veces pero se queda en la instrucción req.getResponseHeader, si me puedes ayudar te lo agradecería

Gracias Miguel, por tus grandes aportes.

Henry
Colombia