es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

React Native expo picker de imágenes carga de imagen a firebase storage (v9) se bloquea.

Estoy intentando subir una imagen seleccionada desde el selector de imágenes de Expo a Firebase Storage (ya que estoy usando Expo).
Revisé el repositorio de Expo Image Picker en Git y encontré el método uploadImageAsync para Firebase.
Así que lo copié y solo hice algunos cambios, pero de alguna manera la aplicación se bloquea la mayoría de las veces. Solo algunas veces, se sube la imagen correctamente sin ningún error.

import { storage } from '../firebase';

async function uploadImageAsync(uri, name) {

    const blob = await new Promise((resolve, reject) => {
        const xhr = new XMLHttpRequest();
        xhr.onload = function () {
            resolve(xhr.response);
        };
        xhr.onerror = function (e) {
            console.log(e);
            reject(new TypeError("Error de solicitud de red"));
        };
        xhr.responseType = "blob";
        xhr.open("GET", uri, true);
        xhr.send(null);
    });

    const fileRef = ref(storage, `files/${name}`);
    const result = await uploadBytes(fileRef, blob);

    // Ya hemos terminado con el blob, lo cerramos y liberamos
    blob.close();

    return await getDownloadURL(fileRef);
}

Dado que la URI proviene de una imagen en el teléfono, uri = file:///Users/~ruta absoluta~/nombre de imagen.jpg
y este es el enlace al Selector de Imágenes de Expo para Firebase:
Selector de Imágenes de Expo para Firebase

El informe del problema dice:
Terminando con una excepción no capturada del tipo NSException
Terminación de la aplicación debido a una excepción no capturada ‘NSInvalidArgumentException’, motivo: -[__NSPlaceholderDictionary initWithObjects:forKeys:count:]: se intentó insertar un objeto nulo desde objects[0]

edit) Descubrí que funciona en Android pero no en iOS.
Para iOS, creo que la conversión a blob está funcionando, pero se produce un error en const result = await uploadBytes(fileRef, blob)

Tags:  , ,

Answer

  1. Avatar for davy.ai

    Problema con la carga de imágenes desde el selector de imágenes de Expo a Firebase Storage

    Si estás intentando cargar una imagen seleccionada desde el selector de imágenes de Expo a Firebase Storage, puedes utilizar la función uploadImageAsync proporcionada por Expo. Sin embargo, si te encuentras con problemas donde la aplicación se bloquea la mayoría de las veces, es posible que necesites realizar algunos cambios en la función.

    Un posible problema podría ser con la URI de la imagen. Dado que la URI proviene del teléfono, puede estar en el formato file:///Usuarios/~ruta absoluta~/nombre de la imagen.jpg. Debes asegurarte de que la URI tenga el formato correcto para Firebase Storage.

    Otro problema podría estar relacionado con la forma en que se crea el blob. Es posible que necesites realizar cambios en la forma en que se crea el blob para asegurarte de que funcione tanto en Android como en iOS.

    Una vez que hayas creado el blob, puedes utilizar la función uploadBytes para cargar el archivo en Firebase Storage. Sin embargo, es posible que enfrentes problemas con esta función en iOS. En este caso, es posible que necesites explorar métodos alternativos para cargar el archivo en Firebase Storage en iOS.

    En general, el proceso de carga de una imagen desde el selector de imágenes de Expo a Firebase Storage puede ser complejo y puede requerir solución de problemas. Sin embargo, una vez que hayas implementado la solución correcta, deberías poder cargar imágenes en Firebase Storage sin problemas.

Comments are closed.