Anteriormente. Flask 12. Formularios con Flask-WTF
Subir archivos al servidor usando Flask-WTF
Habrá ocasiones en las que necesitarás subir archivos a tu servidor. Imagina por ejemplo que tienes una página web de una tienda y tienes que subir imágenes de nuevos artículos que quieres vender. Aunque se puede hacer de otras formas, aprovechando que tenemos fresco la creación de formularios con Flask-WTF vamos a hacerlo de esta manera.
Lo primero vamos a crear un nuevo directorio, dentro de static, llamado img donde guardaremos las imágenes que vayamos subiendo.
Directorio_de_trabajo/static/img
Luego creamos el archivo forms.py que tendrá el código de nuestro formulario. Importamos las librerías necesarias y creamos la clase subir_archivo usando las propiedades FileField y SubmitField para crear los campos. También importamos el validador DataRequired para que sea un campo obligatorio que no se pueda dejar en blanco.
Ahora vamos a programar la página html que contendrá el código de la página y el formulario. La llamaré como siempre, formulario_post.html.
Una cosa importante es que dentro de la etiqueta form hay que usar el atributo:
enctype="multipart/form-data"
lo que nos va a servir para poder enviar archivos a través del método POST.
Lo demás es igual que crear cualquier otro formulario. Insertamos el token se seguridad y creamos los campos "campo_subir" y "enviar".
Ya solo nos queda el archivos de vistas. Solo tendrá una vista que será la vista inicial. (inicio.py)
Importamos las librerías que nos permiten crear la aplicación de Flask y renderizar la página html. Luego importamos el módulo form que creamos al principio del capítulo y que tiene que estar al mismo nivel que la aplicación principal, el archivo inicio.py. Una novedad es que la última librería que importamos es werkzeug.utils. De ella utilizamos secure_filename. Resumidamente lo que hace esta librería es que nosotros le pasamos un nombre de archivo y el nos devuelve una versión segura del mismo que luego podemos guardar en el sistema operativo que tengamos.
Creamos la clave de seguridad, y definimos la vista a la que se podrá aceder con el método GET o POST.
Cuando acedamos por primera vez lo haremos con el método GET con lo que se renderizará el archivo formulario_post.html con un formulario con los campos en blanco. Cuando seleccionemos el archivo, este se valide y se envíe lo hará usando el método POST. Esto hará que form.validate_on_submit sea Verdadero y se ejecute lo que está en su interior.
Creamos un objeto llamado f, de fichero, que recogerá los datos que le hemos pasado en el formulario, vamos el archivo a subir.
Establecemos un nombre_fichero que sea compatible con el sistema de archivos (lo hacemos con la función secure_filename):
nombre_fichero = secure_filename(f.filename)
Y lo guardamos en el directorio adecuado:
f.save(app.root_path+"/static/img/"+nombre_fichero)
La aplicación da la ruta en el directorio para nuestra aplicación principal, luego le añadimos la ruta donde vamos a guardar la imagen (/static/img/) y finalmente le sumamos el nombre del fichero.
Si ejecutas el programa inicio.py obtendrás un formulario donde podrás seleccionar el archivo a subir.
y una vez enviado quedará guardado en el directorio img de la carpeta static. y tendrás un mensaje de que la imagen se ha subido correctamente.
