CÓMO ENVIAR UNA IMAGEN A GOOGLE DRIVE DESDE MIT APP INVENTOR

¡No necesitas ser un experto en programación! Aprende a crear una app sencilla pero poderosa con MIT App Inventor para guardar tus fotos de la galería en Google Drive.


Una aplicación para dispositivos Android utilizando la intuitiva plataforma de MIT App Inventor. Esta aplicación te permitirá seleccionar cualquier imagen de la galería de tu teléfono, asignarle un nombre personalizado y enviarla directamente a una carpeta específica de tu cuenta de Google Drive.

Funcionamiento del Proyecto:

El usuario inicia la aplicación y utiliza el Selector de Imagen para elegir una fotografía de la galería de su dispositivo móvil. Una vez seleccionada, una vista previa de la imagen se muestra en la pantalla.


En el campo de texto (Caja de Texto), el usuario tiene la opción de ingresar un nombre descriptivo para la imagen que se guardará en Google Drive. Este paso facilita la organización y posterior búsqueda de los archivos.


Al presionar el botón "Enviar", la aplicación toma la imagen seleccionada, la convierte a un formato de texto seguro para la transmisión web (Base64) y envía estos datos, junto con el nombre proporcionado, al script de Google Apps Script alojado en Google Drive.


El script de Google Apps Script recibe los datos de la imagen y el nombre. Utiliza la información para crear un nuevo archivo de imagen en la carpeta designada dentro del Google Drive del usuario, utilizando el nombre proporcionado.

Google Apps Script:

Aquí pueden observar el código desarrollado en Google Apps Script. Como verán, la mayor parte del código está comentado brevemente para facilitar su comprensión. 
function doPost(e) 
{
 try
 {

    //Obtener la imagen en Base64
    const encodedBase64 = e.parameter.imageData;

    //Decodificar la URI
    const base64Image = decodeURIComponent(encodedBase64);

    //Decodificar la imagen a bytes
    const decodedImage = Utilities.base64Decode(base64Image);

    //Nombre por defecto
    let imageName = e.parameter.imageName || "imagen_desde_appinventor.jpg";

    //Obtener el formato
    const imageFormat = e.parameter.imageFormat || "jpg";

    //Tipo MIME
    let mimeType = "image/jpeg";

    //Verificar si el nombre ya tiene la extensión
    //Si no tiene la extensión se le añade
    if(imageFormat.toLowerCase() === "png")
    {
      mimeType = "image/png";

      if(!imageName.toLowerCase().endsWith(".png"))
      {
        imageName += ".png";
      }
    }
    else if (imageFormat.toLowerCase() === "jpg" || imageFormat.toLowerCase() === "jpeg")
    {
      if (!imageName.toLowerCase().endsWith(".jpg") && !imageName.toLowerCase().endsWith(".jpeg"))
      {
        imageName += ".jpg";
      }
    }

    //Modificar el formato que Google Drive pueda entender
    const blob = Utilities.newBlob(decodedImage, mimeType, imageName);

    //Obtener o crear la carpeta
    const folderName = "ImgAppInventor";
    let folder = DriveApp.getFoldersByName(folderName);
    if (folder.hasNext())
    {
      folder = folder.next();
    }else
    {
      folder = DriveApp.createFolder(folderName);
    }

    //Subir la imagen
    folder.createFile(blob);

    //Devolver una respuesta de éxito
    return ContentService.createTextOutput(JSON.stringify({"status": "Excelente"}))
    .setMimeType(ContentService.MimeType.JSON);

 }catch(error)
 {
    //Devolver una respuesta de error
    return ContentService.createTextOutput(JSON.stringify({"status": "error","message": error.toString()}))
    .setMimeType(ContentService.MimeType.JSON);
 } 
}
¡Este proyecto es solo el comienzo! Las habilidades que adquieras con el video tutorial, desde la manipulación de archivos hasta la conexión con la nube, te abrirán las puertas para explorar y desarrollar una amplia gama de aplicaciones creativas y funcionales en MIT App Inventor. Podrías adaptarlo para guardar documentos y archivos de audio.




Te agradecería que me dejaras un me gusta en el video.



¿Qué encontrarás en el archivo descargable?
  • Aquí encontrarás el archivo del proyecto de MIT App Inventor que desarrollamos en este tutorial.
  • Solo faltaría configurar la URL.
Recuerda que para usar el proyecto, necesitas:
  • Configurar tu propia cuenta de Google Drive.
  • Crear la carpeta específica donde se almacenarán las imágenes.
  • Crear y configurar el archivo de Google Apps Script siguiendo los pasos que vimos en este tutorial.
  • Enlazar la URL de ese script con su aplicación de MIT App Inventor.

 Descargar 

ImgDriveV01.aia - 9 KB

Créditos Base64 Convertor
  • METRIC RAT AI2
  • https://metricrat-hosting.web.app/#19
  • https://creativecommons.org/licenses/by-sa/4.0/

¿Cómo importar el archivo a mis proyectos?

  • El archivo lo debes de importar en MIT App Inventor en la opción de proyectos e importar proyecto desde mi ordenador.



¿Cómo probar el proyecto?
  • En MIT App Inventor presiona en la opción Conectar y AI Companion.


  • Se genera un código QR o de 6 caracteres.


  • Descarga la aplicación MIT AI2 Companion de forma gratuita en Google Play o App Store.
  • Escanea el código QR o ingresa el código de 6 caracteres.