logo El diario de Pepe Molina (Caricatos)

yo

Hemos visto como subir archivos con Ajax, donde contábamos de un formulario y un control para seleccionar ficheros, pero cómo lo haríamos sin esa selección...


Última caricatura

Andrés Iniesta: Futbolista español. En la actualidad juega en el Barcelona.

Andrés Iniesta

RSS de las imágenes: rss


La Cita

Resulta divertido hacer lo imposible

Walt Disney, cineasta estadounidense (1901-1966).


En esta zona están las páginas personales del autor.


Mis clientes ahora también son mis amigos (aunque les cobre).


En Mis amigos Informáticos hay una pequeña colección de páginas de colegas webmasters..


En Mis amigos artistas podemos encontrar artistas de cualquier índole (dibujantes, pintores, escritores...)


Las recomendaciones que proponemos son de índole variada.


Aquí un cajón de sastre de enlaces.


Nos referencian desde sitios de toda índole.


Puede contribuir a mantener esta página con su donativo.


botón pay-pal

Ajax para copiar ficheros

emoticón de Caricatos Publicado el día 12 de julio de 2014
id=138; categorías: Vicisitudes de un Webmaster, Programación

Hemos visto como subir archivos con Ajax, donde contábamos de un formulario y un control para seleccionar ficheros, pero cómo lo haríamos sin esa selección...

No se me ocurre otra razón para este cometido que las funciones administrativas de una web, pero si existiesen otras, con este apunte veremos cómo lograrlo.

Supongamos que nuestra intención es copiar nuestro logo (logo.png) que se encuentra en la raiz del dominio, a la carpeta "/ficheros". Tenemos que tener el mismo formulario y el mismo control "file" indicados en el anteriormente citado apunte, pero podemos tenerlo oculto, así que nos valdremos de la ruta de la imagen.

El código que hemos asociado a un elemento de la página para nuestro objetivo es el siguiente:

var logo;
function copiar()	{
	Ajax_1 = new XMLHttpRequest();
	Ajax_1.open('GET', tag("imagen").src, true);
	Ajax_1.responseType = "blob";
	Ajax_1.onload = function() {
		if (Ajax_1.status == 200) {
			logo = this.response;
			blob = new Blob([logo]);
			fd = new FormData(tag("prueba"));
			fd.append("fichero", blob, tag("imagen").src.substr(tag("imagen").src.lastIndexOf("/") + 1));
			Ajax_2 = new XMLHttpRequest();
			Ajax_2.open("POST", tag("prueba").action, true);
			Ajax_2.onreadystatechange = function()	{
				if	(Ajax_2.readyState == 4 && Ajax_2.status == 200) {
					tag("respuesta").innerHTML = Ajax_2.responseText;
				}
			}
			Ajax_2.send(fd);
		};
	};
	Ajax_1.send();
}

Encontramos algunas cosas nuevas que comentaremos a continuación.

Novedades

Esperar una respuesta Ajax de un fichero sin parámetros es normal, pero habitualmente esperamos texto plano o con formato xml, pero en este caso esperamos una imagen, así que hemos tenido que definir un nuevo atributo para nosostros: Ajax.responseType, indicando el tipo de datos "blob". Tampoco nos serviría las respuestas más habituales: "responseText" y "responseXML", pero sí nos sirve "response" (a secas).

Teniendo la respuesta en la variable "logo", tenemos que crear un objeto del tipo "Blob" con los datos recogidos, y asignarlo al control del formulario con la instrucción append.

Suponiendo que la respuesta del fichero que procesa el envío mediante Ajax tan solo muestre la variable $_FILES

print_r($_FILES);

la respuesta obtenida es:

Array
(
    [fichero] => Array
        (
            [name] => logo.png
            [type] => application/octet-stream
            [tmp_name] => http://www.pepemolina.com/XXXXXXX.tmp
            [error] => 0
            [size] => 3500
        )
)

El código que nos falta es una comprobación de la existencia del fichero y la correspondiente copia:

move_uploaded_file($_FILES["fichero"]["tmp_name"], "ficheros/".$_FILES["fichero"]["name"]);

Esperamos que sea de utilidad.

Zona de comentarios

Este apunte aún no tiene comentarios.

Evaluación

Valoración de esta página: (apunte.138) valor

Valoración evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar

Respuesta: Zona de mensajes (proceso de evaluación)

Historial de navegación

Esta página ha sido visitada en 8307 ocasiones


Disponemos de rss sindicar

Y del Mapa del sitio, además del sitemap.xml.


Aquí podemos encontrar los apuntes más visitados.

"Top 10" reemplaza a la sección Últimos apuntes.


Una buena forma de buscar un apunte es a partir de su categoría.


También es posible buscar apuntes por medio de las etiquetas (tags).


Hemos decidido poner al alcance de todos algunos comodines.

Adjuntamos una versión reducida del "buscador interno" que vemos en la lista anterior:

Buscar en apuntes

También estamos recopilando antiguas páginas del sitio.


Desde este recuadro se puede hacer una búsqueda cronológica.


Se puede crear una postal nueva desde el enlace del sector "Otras páginas del dominio", o editar la que sale en el recuadro, pulsando sobre ella..

http://www.pepemolina.com/postales/Fondos/santa.gif
http://www.pepemolina.com/postales/animales/gato8t.gif
Feliz Navidad
Feliz Navidad
enlace a la postal
Copyright © 2002-2017 www.pepemolina.com
RSS rss | Ver Mapa del sitio