El subir archivos a un servidor o upload es una de las tareas mas comunes, en esta ocación veremos la forma de subir archivos utilizando flash. Para ello haremos unos de la clase FileReference que permite subir o descargar archivos desde el servidor.
Creando el archivo inicial
Lo primero es crear un archivo flash con cuatro elementos básicos, el primero un campo de texto llamado txtarchivo que contendrá el nombre del archivo seleccionado para subir, el segundo es un botón llamado btbrowse que servirá para mostrar la ventana para buscar el archivo a subir, el tercero es un botón llamado btenviar que se encargará de hacer iniciar el envío y finalmente un campo de texto llamado txtestado que mostrará el estado del proceso.
Además de ello es necesario importar la clase que contiene a FileReference de la siguiente forma:
[as]
import flash.net.FileReference;
[/as]
Filtrando tipos de Archivo
Lo siguiente es definir que tipos de archivos se podrán aceptar, para ello creamos una variable llamada arrTypes donde agregaremos un objeto que contiene dos propiedades: description (Texto a mostrarse al seleccionar el archivo) y extension (Contiene todas las extensiones aceptadas).
[as]
var arrTypes:Array = new Array();
var objTypes:Object = new Object();
objTypes.description = «Images (*.jpg, *.jpeg, *.gif, *.png)»;
objTypes.extension = «*.jpg; *.jpeg; *.gif; *.png»;
arrTypes.push(objTypes);
[/as]
Subiendo Archivos
El siguiente paso es crear una variable del tipo FileReference con el cual podremos subir los archivos seleccionados. Una vez creada la variable listUpload le adjuntamos un listener que nos servirá para detectar los eventos del upload. Por ejemplo al seleccionar el archivo (onSelect) mostramos el nombre del archivo seleccionado en el campo txtarchivo.
[as]
var listUpload:Object = new Object();
var fileUpload:FileReference = new FileReference();
fileUpload.addListener(listUpload);
listUpload.onSelect = function(file) {
txtarchivo.text = file.name;
}
listUpload.onProgress = function(file, bytesLoaded, bytesTotal):Void {
txtestado.text = «Subiendo archivo » + Math.round(bytesLoaded*100/bytesTotal) + «%»;
}
listUpload.onComplete = function(file:FileReference):Void {
txtestado.text = «Archivo subido correctamente»;
}
[/as]
Luego de ello es necesario agregarle las opciones a nuestros botones, agregamos el evento para seleccionar y para enviar.
[as]
btbrowse.onRelease = function() {
fileUpload.browse(arrTypes);
}
btenviar.onRelease = function() {
fileUpload.upload(«upload.php?action=upload»);
}
[/as]
Uniendo todos estos elementos, tenemos el código necesario para hacer upload de archivos en flash.
[as]
import flash.net.FileReference;
var arrTypes:Array = new Array();
var objTypes:Object = new Object();
objTypes.description = «Images (*.jpg, *.jpeg, *.gif, *.png)»;
objTypes.extension = «*.jpg; *.jpeg; *.gif; *.png»;
arrTypes.push(objTypes);
var listUpload:Object = new Object();
var fileUpload:FileReference = new FileReference();
fileUpload.addListener(listUpload);
listUpload.onSelect = function(file) {
txtarchivo.text = file.name;
}
listUpload.onProgress = function(file, bytesLoaded, bytesTotal):Void {
txtestado.text = «Subiendo archivo » + Math.round(bytesLoaded*100/bytesTotal) + «%»;
}
listUpload.onComplete = function(file:FileReference):Void {
txtestado.text = «Archivo subido correctamente»;
}
btbrowse.onRelease = function() {
fileUpload.browse(arrTypes);
}
btenviar.onRelease = function() {
fileUpload.upload(«upload.php?action=upload»);
}
[/as]
Guardando los archivos en el Servidor
Hasta este punto se ha hecho el envío al servidor, pero nos hace falta un script en el servidor que se encargue de recibir y guardar este archivo. En nuestro caso utilizaremos PHP, para ello nos basaremos en el ejemplo Upload de Archivos con PHP.
if ($_GET["action"] == "upload") {
$archivo = $_FILES["Filedata"]['name'];
$prefijo = substr(md5(uniqid(rand())),0,6);
if ($archivo != "") {
$destino = "files/".$prefijo."_".$archivo;
copy($_FILES['Filedata']['tmp_name'], $destino);
}
}
Pueden ver el resultado del ejemplo en flashupload. Finalmente les dejo los archivos fuente del ejemplo, para que lo puedan probar y hacer sus adaptaciones.
Comentarios Total 93 comentarios
Publicado: 22/12/2008 12:57 pm
Hola, me sirve el script en el programa de Flash, todo funciona bien al parerecer y aún el envio y guardar informacion en PHP, pero al revisar la carpeta Files en el servidor, no encuentra la información subida. Tengo servidor Linux.
Agradezco su atención.
Publicado: 22/12/2008 2:41 pm
Es muy probable que la carpeta donde se suben las imagenes no tengan permiso de escritura, verifica que esta carpeta permita la escritura.
Publicado: 12/01/2009 2:10 pm
hoola!
Gracias por la aportacion es un excelente trabajo, solo que tengo un problema, no puedo ver a onde llegan los archivos a pesar d que se indica q el archivo fue subido correctamente, ya tenia creada la carpeta de files, que puedo hacer ayuda!!
Muchas gracias
Publicado: 14/02/2009 10:55 am
Hola!
He encontrado una modificación de este cógigo en la que se utiliza un barra de progreso. La url es:
http://codigo-fuente.com/programacion_web/carga-de-archivos-con-barra-de-progreso-en-flash-y-php/
Publicado: 26/02/2009 1:44 pm
mmm TENGO UN PROBLEMA EL BOTON DE EXAMINAR ME FUNCIONA CORRECTAMENTE, PERO CUANDO LE DOY AL BOTON DE SUBIR O EN SU DEFECTO DE ENVIAR, NO HACE NADA, NO SE QUE PUEDO HACER O COMO RESOLVERLO SOLO ME FALTA ESO
Publicado: 21/03/2009 1:04 pm
Alguien sabe por que en unos servidores funciona y en otros no?
hay que habilitar algunos permisos?
Gracias
Publicado: 22/03/2009 5:20 pm
Hola, el tutorial me funciona perfecto, le cambie a que me descargara archivos .doc y xls, pero cuando le doy clik al de la laista, no me los descarga o aveces lo que hace es descargar un .zip que tiene basura)
Gracias por la ayuda
Publicado: 02/05/2009 9:04 pm
Muy bueno tu aporte y gracias por compartirlo, pero no puedo abrir el .fla con flash 8 podes ayudarme x fvor? GRacias
Publicado: 10/06/2009 9:56 am
Gracias por el aporte, es muy útil, quisiera saber como le hago para que ya que cargo la foto se puede ver inmediatamente a través de un loadMovie, para Mostrar la foto que se cargo?.
Gracias.
Publicado: 06/10/2009 12:00 pm
cómo hago para enviar en un mail la imagen que subi mas otros datos?
Publicado: 06/10/2009 12:01 pm
cómo hago para enviar en un mail la imagen que subi mas otros datos?
Por ejemplo:
Nombre
Apellido
Mail
FOTO
Publicado: 21/01/2010 6:33 pm
alguien me puede ayudar a configurarlo para instalarlo en mi web?
no se que parametros tengo que camiar con mis datos
gracias
Publicado: 12/04/2010 11:54 pm
grax x el tutorial, me ha servido bastante. aunq me he visto en la necesidad de hacerle algunas modificaciones, tu trabajo se agradece.
Publicado: 28/04/2010 1:21 pm
Hola a mi me funciona el script perfectamente pero cuando lo integro con una funcion de rescalado que tengo se va todo al traste, mi pregunta es si el archivo es jpg y el mime es «image/jpeg» porque cuando los subo desde flash y compruebo el mime $mime = $_FILES[‘Filedata’][‘type’]; me da que es «application/octet-stream»
Muchas gracias por el tutorial
Publicado: 05/05/2010 11:20 am
Hola.
Genial el tutorial, pero necesito saber cómo conocer con anterioridad a subir el archivo sus respectivas dimensiones, es decir solo subir archivos con dimensiones 240 x 200 px
Publicado: 12/05/2010 7:37 pm
Buenas.. Muy buen tuto.
Una pregunta, ¡ como hago para limitar las subidas por ip ?
Por ejemplo quiero que un ip solo pueda subir 1 archivo al día .. como haría ?
Gracias por adelantado
Publicado: 09/06/2010 11:39 am
Muchas gracias.
Muy buen ejemplo. Funciona perfecto.
Obviamente solo necesito una parte y tengo que adecuarlo a mis necesidades pero la verdad, muy bien explicado y muy útil.
Saludos,
Martín Mariano Gil
Publicado: 28/06/2010 5:05 pm
Saludos.
ya he revisado ambos tutoriales. este de upload de archivos y el del correo por flash. pero como hago para que ambos interactuen y poner en la misma película del correo los elementos de este?. como declaro variables?. mi intención es que mientras envián un correo suban más de un archivo y lleguen al mismo correo junto con el texto capturado.
gracias y suerte
Publicado: 16/09/2010 7:04 pm
Una pregunta. con este script de flash es posible cargar mas de una imagen al mismo tiempo? es primera vez que veo un script asi (no se trabajar con flash) pero me interesa porque e visto varias paginas que te permiten cargar mas de un archivo al mismo tiempo. con este script se puede hacer eso? o habria que ponerle algo mas???
Publicado: 16/09/2010 7:26 pm
Man para los que preguntan sobre el tamaño del archivo de envio. Tienen que verificar y modificar upload_max_filesize de PHP, pues el por defecto tiene como valor maximo 2 Mb. al modificarlo te permitira enviar archivos mayores……..
Publicado: 20/09/2010 10:55 am
Excelente tutorial, gracias por compartir tu scrip.
Publicado: 22/09/2010 10:18 am
HEEEEEEEY gente, que pasa? No lees que a muchos no les funciona, no hay un solo post que resuelva el problema.
Publicado: 03/10/2010 9:44 pm
Hola, muy copado, te hago una pregunta simple, o capas que no, cual es la clase que hace que no te marque la ruta de donde estas subiendo la imagen. Por ejemplo: haces clic en la lupita, y te dice solo el nombre del achivo, y la extencion, pero no te da la ruta de donde la estas sacando. Digamos, funciona pero me podrias decir que hace que no aparezca dicha ruta?
Publicado: 05/10/2010 6:01 pm
Hola, me funciona a la perfeccion, como le hago para que cuando suba la imagen no me ponga un nombre aleatorio, sino que me lo ponga en orden, o sea… que me guarde la imagen en el directorio con el nombre original+1, despues que me suba la otra y me la guarde con el nombre original+2 y asi suscesivamente. Help!!!
Publicado: 28/10/2010 9:47 pm
Hola muy bueno el post, y veo q ha servido a varios… Yo necesito justamente cargar una imagen pero con otros datos y q todo me llegue via mail para saber a quien corresponde la imagen subida…
Nombre
Mail
Comentario
Cargar foto
Si me pueden ayudar.. eternamente agradecida.. sls
Publicado: 09/12/2010 1:58 pm
Tengo una duda, según la información de flash, en la clase FileReference se pueden enviar postdata con Download, pero no entiendo para que…
Podría enviarse un XML en un postdata para ser procesado en PHP, crear un fichero temporal para ser descargado como un fichero existente?
Publicado: 13/06/2011 11:43 am
no funciona el link de descarga
Publicado: 05/07/2011 7:15 pm
hola he aplicado tu tutorial en famacolor.mx y me funciona perfecto en mac pero en pc no se termina de cargar marca el 100% pero el archivo no aparece en el ftp alguna sugerencia?
Publicado: 20/07/2011 1:20 pm
funciona para subir pdf ?? solo debo agregar la extencion ????
Publicado: 20/07/2011 10:00 pm
En este caso el ejemplo solo permite subir imagenes, para que acepte archivos PDF, tienes que cambiar las líneas:
objTypes.description = "Images (*.jpg, *.jpeg, *.gif, *.png)";objTypes.extension = "*.jpg; *.jpeg; *.gif; *.png";
Lo reemplazamos por:
objTypes.description = "Adobe PDF (*.pdf)";objTypes.extension = "*.pdf";
Publicado: 09/08/2011 12:23 pm
Hola a todos.
La verdad un exelente post, busque esto durante mucho tiempo sin buenos resultados. Todo me funciona perfecto, el unico problema es que no puedo ver las imagenes que subi, coloque la carpeta «files» en mi servidor y todo, pero nunca veo las imagenes cargadas. ALGUIEN YA PUDO RESOLVER ESTE PROBLEMA?? mil gracias a todos
Publicado: 09/08/2011 12:32 pm
Hola a todos,
problema resuelto (para los que no podian ver las imagenes subidas) tienen que crear una carpeta con el nombre «files» en el mismo lugar donde estan los archivos index, lista, funcion, upload, etc. ejemplo:
si su web esta alojada en la carpeta «root» de su servidor ahi dentro tienen que armar otra carpeta con el nombre (por ejemplo) «subir» para asi ingresar a la parte de cargar imagenes de la sig. manera: http://www.susitio.com.ar/subir, de esa manera aparecera el contenedor para seleccionar imagenes….
Ahora, dentro de la carpeta «subir» antes creada, tienen que armar la carpeta «files» para que asi todo funciones…
No se que mas decir… lo trate de explicar lo mas facil posible…
Saludos a todos
Publicado: 09/08/2011 1:31 pm
Otra pregunta…
Digamos que ya esta todo esto en orden, puedo subir la imagen, aparece en la carpeta, todo perfecto… Ahora, supongamos que yo quiero eliminar la imagen subida, por ejemplo, que vea la lista de las imagenes sibidas y que tenga una opcion para poder eliminarla.
Seria mucho pedir una mano en eso??
Millones de gracias a todos por este aporte
Publicado: 24/08/2011 11:09 am
Che pablo, a mi me dice lo mismo de que esta subiendo, y cuando termina de subir me da el mensaje de éxito; pero no me sube los archivos al directorio «files» o sea que lo hace fantasmal xq no sube nada (el directorio files tiene permiso 777)
Publicado: 24/08/2011 11:15 am
Ahora me estoy dando cuenta que en LOCALHOST me funciona sin problemas y me muestra todos los archivos que subí al «files» pero cuando lo subo a mi servidor no ya deja de funcionar y no me sube los archivos (lo hace de forma fantasmal) pero no me sube ningún archivo; que puede ser???
Publicado: 21/09/2011 3:45 pm
Y si quiero que acepte imagenes y archivos pdf conjuntamente como podria ser…
Publicado: 28/09/2011 6:58 am
Hola Bilos debes colocar en
objTypes.description = «Files (*.jpg, *.jpeg, *.gif, *.png, *.pdf)»;
objTypes.extension = «*.jpg; *.jpeg; *.gif; *.png; *.pdf»;
Espero responder tu pregunta
Chicos tengo un problema… en mac, todo me funciona perfect… pero a veces el nombre del archivo no aparece… y el problemon mas grande es que tengo es que debo añadir en ese archivo en una carpeta en el servidor que puede que exista y puede que no con java pregunto if(file.exists()) else file.mkdirs pero para mac asi exista el fichero no entra y me crea nuevamente la carpeta…. es decir me crea dos carpetas con el mismo nombre contenido diferente en una misma carpeta. No consigo informacion de solucion en java y la de flash a veces pasa a veces no! pero los archivos si suben todo fino
Publicado: 13/10/2011 3:56 pm
Fatima un millon de gracias por tu respuesta, pero yo me referia a que salieran en opciones distintas en el combo, me explico mejor:
Que por default salgan los formatos para las imagenes, pero que uno pueda cambiar cliqeando en ese combo para escoger otro tipo de archivos…
Fatima, gracias nuevamente…
Publicado: 13/10/2011 4:00 pm
Y que tiene que ver el archivo mail.php con el proyecto?, disculpen la pregunta pero no soy muy duchado en PHP
Sera que cuando sube las imagens emite un correo? a quien? o como lo habilito si en un caso no lo hace?
Gracias…
Publicado: 10/11/2011 4:53 pm
De que forma puedo subir la imagen y previsualisarla como las fotos de identificacion de las redes sociales usando solo action script 3.0. Lo necesito sin usar php, pues lo que se necesita es ahorrar en lo referente al ancho de banda. GRACIAS
Publicado: 16/01/2012 10:27 am
DEVEN PONERLO EN C/: WAMP/WWW
Y EJECUTARLO DESDE EL NAVEGADOR CON LOCALHOST
Publicado: 11/01/2013 1:54 pm
Saludos.. amigos…. podrias ayudarme… necesito que en vez de usa Php utilize APS ( se que es ya viejo pero asi lo nesecito)
Publicado: 18/11/2013 3:41 am
Hola, una pregunta es posible setear el path del archivo a subir, directamente en el textbox??, es decir, sin necesidad de abrir el dialog??.