[Php-avanzado] consulta

Matias Gea matigea en gmail.com
Mie Nov 20 00:34:14 ART 2013


Me olvidaba, para ver compatibilidad de funcionalidades, buscá FileApi y
FormData en http://caniuse.com.

Saludos!


El 20 de noviembre de 2013 00:31, Matias Gea <matigea en gmail.com> escribió:

> Hola, Daniel.
>
> Hoy en día, subir archivos desde Javascript al server es relativamente
> simple... Si el navegador lo soporta.
>
> Para subir un archivo tenés que soportar dos cosas, primero el File API,
> para poder leer el contenido del archivo a enviar, y luego FormData, que
> son un conjunto de utilidades para crear la estructura de un formulario,
> pero de manera programática, sin tener que poner los controles html.
>
> El ejemplo corto y conciso lo ves en la uri que te pasó Leo (
> http://geeks.ms/blogs/etomas/archive/2012/12/12/html5-apis-upload-de-ficheros-con-ajax-file-api-y-progress-api.aspx),
> lo modifiqué un poco y comenté:
>
> function subirFichero(file) {
> /* se instancia el objeto xhr, este es el que hace el envío */
> var xhr = new XMLHttpRequest();
>
> /* se instancia el objeto FormData, que es el que prepara los datos para
> enviar */
> var formData = new FormData();
>
> /* acá se agrega el archivo, va a llegar en $_FILES['archivo'] */
> formData.append("archivo", file);
>
> /* acá agregás más datos al envio */
> formData.append("accion", 'guardar');
>  formData.append("id_item", 45);
>
> /* añadimos eventos para manejar el error y el éxito del envio */
>  xhr.addEventListener("error", function(e) {
> alert("Error subiendo el archivo.");
>  }, false);
>
> xhr.addEventListener("load", function(e) {
> alert("fichero subido: " + e.target.status + "->" + e.target.statusText);
>  });
>
> /* seteamos parametros de conexión y enviamos, esto es igual que el ajax */
> xhr.open('POST', '@Url.Action("Index")', true);
>  xhr.send(formData);
> }
>
> Podés también agregar un escucha al evento "progress" para seguir el
> progreso de la subida (cuantos bytes lleva subido el navegador).
>
> Si tu navegador no soporta FileAPI o FormData, no podés subir por AJAX,
> tenés que encontrar otra forma. Uno de los métodos más usados es tener un
> iframe oculto en la página y que el target del formulario sea ese iframe.
> Una vez que se haya enviado el archivo y que el server responda (recordá
> que la respuesta queda en el iframe), la respuesta trae una instrucción
> javascript, que ejecuta una funcion de "exito" en el parent, por ejemplo:
>
> <script type="text/javascript">
> parent.sucessfulUpload()
> </script>
>
> Este método es algo más sucio, pero efectivo. Si quisieras observar el
> progreso, el server php debe tener instalada la extensión APC o algún otro
> progress watcher (si querés más detalles, avisame).
>
> Otra forma es utilizando un uploader en flash, pero tiene muchas
> desventajas, principalmente, que usa flash.
>
> Si tu uploader va a ser para un administrador o sistema privado (donde
> podés poner requerimientos de software), o si no te importa no soportar
> navegadores viejos e IE, te recomiendo el método HTML5 (FileApi, FormData,
> XMLHttpRequest).
>
> Cualquier cosa, pregunta.
>
> Saludos!
>
>
> 2013/11/19 Leonardo Tadei - Pegasus Tech Supply <
> leonardot en pegasusnet.com.ar>
>
>> Hola Daniel,
>>
>>
>> El mar, 19-11-2013 a las 20:07 -0300, Daniel Billia escribió:
>> > Hola Leo lo único que lo quería hacer en ajax ya
>> > que esta echa la rutina en ese formato pero si es
>> > complicado cambiamos el formato
>>
>>
>>         Tendrías que evaluar vos, respecto a tu código,qué cosa es más
>> complicada.
>>         Te envío unos enlaces que encontré que no usan bibliotecas pqra
>> que los
>> estudios.
>>         No mezcles las formas de trabajar
>>
>> http://www.desarrolloweb.com/articulos/ajax-file-upload.html
>>
>> https://developer.tizen.org/help/index.jsp?topic=%
>> 2Forg.tizen.web.appprogramming%2Fhtml%2Ftutorials%2Fw3c_tutorial%
>> 2Fcomm_tutorial%2Fupload_ajax.htm
>>
>>
>> http://geeks.ms/blogs/etomas/archive/2012/12/12/html5-apis-upload-de-ficheros-con-ajax-file-api-y-progress-api.aspx
>>
>> > Saludos
>>
>>         =mente
>>
>> --
>> Leonardo Tadei
>> leonardot en pegasusnet.com.ar
>> Web: http://leonardo.tadei.com.ar
>> Firma pública: http://www.pegasusnet.com.ar/LeonardoTadei-public.key
>>
>> _______________________________________________
>> Lista de correo: Php-avanzado
>> Mensajes a la lista: Php-avanzado en pato2.fi.mdp.edu.ar
>> Administración Web:
>> http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado
>> Desubscripción:
>> php-avanzado-request en pato2.fi.mdp.edu.ar?subject=unsubscribe
>>
>
>
>
> --
> Matias Fernando Gea
> matigea en gmail.com
> http://www.mfgea.com.ar
>



-- 
Matias Fernando Gea
matigea en gmail.com
http://www.mfgea.com.ar
------------ próxima parte ------------
Se ha borrado un adjunto en formato HTML...
URL: <http://www3.fi.mdp.edu.ar/pipermail/php-avanzado/attachments/20131120/03686d3e/attachment-0001.html>


Más información sobre la lista de distribución Php-avanzado