En este post te mostraré un software muy simple que he creado recientemente. Es para compartir archivos por internet y enviarlos de manera rápida y simple.

La principal función de esta app para transferir y compartir archivos es su funcionamiento para subir archivos en conexiones lentas.

Básicamente es como una alternativa open source y gratuita a WeTransfer, File.io, Firefox Send, etcétera.

A lo largo de este post te enseñaré cómo funciona, cómo puedes tenerla gratis (ya que usa Firebase en su plan gratuito) y cómo montarla en un servidor gratuitamente.

Nota: puedes ver cómo luce la app al descargar un archivo en este enlace.

Mi propio WeTransfer

En ocasiones mi internet es muy lento, realmente lento (no diré cuál es mi ISP porque no quiero hablar mal de Telmex), tanto que incluso un archivo de 10 Megabytes tarda aproximadamente 15 minutos en subirse.

Pero eso no es lo peor; lo peor es que cuando va en un 90 % u 85 %, la subida se reinicia. Entonces decidí usar el servicio de Firebase con su método uploadBytesResumable y hacer una simple app que sirve para compartir archivos.

Subiendo archivo

Veamos el módulo principal que el de la subida del archivo. Elegimos cualquier archivo de cualquier peso y le damos clic a Subir. Se va a mostrar la barra de progreso:

Subir archivo para compartir - Aplicación web gratuita y open source

Subir archivo para compartir – Aplicación web gratuita y open source

He probado desconectando el internet, y en ese caso la subida se pausa pero no se cancela. Cuando termina, podemos ver los archivos que tenemos subidos.

Archivos que hemos compartido

En esta app que se parece a WeTransfer podemos ver los archivos que hemos compartido en donde tenemos varias opciones, que son: eliminar el archivo, abrir el enlace de descarga en una nueva pestaña y copiar el enlace al portapapeles:

Archivos subidos en software para compartir archivos

Archivos subidos en software para compartir archivos

Básicamente sirve para eso: subir y transferir archivos a usuarios.

Compartir archivo

Si abrimos el enlace en una nueva pestaña o copiamos el mismo, tendremos el enlace de descarga. Ese enlace ya podemos enviarlo y compartirlo:

Enlace de descarga de archivo compartido

Enlace de descarga de archivo compartido

La alerta que aparece la coloqué yo para ahorrarme decirle eso a mis clientes cada que les envío archivos. Obviamente se puede modificar.

Seguridad de la transferencia de archivos

Esta aplicación utiliza la autenticación de Firebase. Todo necesita autentificación, excepto el método get de los datos de un archivo.

Para el caso de los archivos se usa un UUID versión 4 y se guardan en una carpeta con ese UUID. Ese UUID no es predecible, ya que es criptográficamente seguro.

Si el UUID se quiere obtener se necesita tener el ID del documento, y no se pueden obtener todos los datos porque la regla list está restringida a los usuarios con auth.

En pocas palabras: los usuarios no autenticados solo pueden ver el archivo que les enviaste.

Contador de descargas

Después de haber publicado la app, agregué la opción de contar las descargas del archivo (colocando la fecha de descarga en la hora local).

De este modo podemos ver cuántas veces han descargado el archivo que compartimos.

Contador de descargas de archivos transferidos con aplicación gratuita y open source

Contador de descargas de archivos transferidos con aplicación gratuita y open source

Lo único que cambia son las reglas, pero eso está actualizado más abajo en donde están las reglas generales.

Los detalles de las descargas están en otra colección para que los usuarios (sin saberlo) agreguen el registro de que han descargado nuestro archivo pero no puedan modificar al archivo en sí.

Código fuente y descargas

Como te dije anteriormente: esta aplicación para compartir archivos es open source y gratuita. El almacenamiento no te costará nada ya que puedes usar el plan gratuito de Firebase.

Si quieres tu propia versión puedes acceder al código fuente en: https://parzibyte.me/l/ovkc4s

Una vez que tengas el código fuente asegúrate de contar con NPM y Node. Abre una terminal en el proyecto e instala las dependencias con npm install.

Código fuente de app para compartir y transferir archivos

Código fuente de app para compartir y transferir archivos

Luego crea un nuevo proyecto de Firebase con Firestore y Storage, crea un archivo .env basándote en el .env.example y configura las claves API. Un ejemplo de las credenciales está en este tutorial.

Ahora ejecuta npm run serve y podrás acceder a la app en localhost:8080. Puedes hacer los cambios que creas pertinentes y después compilar la app para producción con npm run build.

Al ejecutar el comando anterior tendrás la app ya compilada para producción. En este punto puedes convertirla en PWA con Workbox como se indica en este tutorial, ejecutando workbox generateSW workbox-config.js.

Ya sea que hayas elegido convertirla a PWA o no, puedes alojar el CSS, JS y HTML en cualquier servidor. Si quieres uno gratuito yo recomiendo las GitHub Pages.

Configuración de Firebase

En cuanto a la configuración de Firebase debes configurar la autenticación con correo y contraseña, y debes agregar los usuarios desde la consola. También debes configurar Storage y Firestore.

Las reglas de Storage son:

Y las de Firestore son:

Obviamente tú puedes configurarlas y cambiarlas de acuerdo a lo que necesites.

Conclusión

Esta app es muy simple pero funciona para el único propósito que tiene. Recuerda que también hice algo parecido a Google Drive con PHP y MySQL por si quieres algo parecido a eso.

Por aquí te dejo más software que he creado y publicado.


Estoy disponible para trabajar en tu proyecto o realizar tu tarea pendiente, no dudes en ponerte en contacto conmigo.
Si el post fue de tu agrado muestra tu apoyo compartiéndolo, suscribiéndote al blog, siguiéndome o realizando una donación.

Suscribir por correo

Ingresa tu correo y recibirás mis últimas entradas sobre programación, open source, bases de datos y todo lo relacionado con informática

Únete a otros 6,046 suscriptores

parzibyte

Programador freelancer listo para trabajar contigo. Aplicaciones web, móviles y de escritorio. PHP, Java, Go, Python, JavaScript, Kotlin y más :) https://parzibyte.me/blog/software-creado-por-parzibyte/

0 Comentarios

Deja un comentario

Marcador de posición del avatar

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

A %d blogueros les gusta esto: