反应本地博览会图像拾取器将图像上载到Firebase存储(V9)崩溃

我正在尝试将从世博会图像拾取器中选择的图像上传到Firebase存储(因为我正在使用世博会)。 我查看了EXPO图片选择器Git,找到了Firebase的ploadImageAsync。 所以我复制了它,只做了一点改动,但不知何故,它大多数时候都会让应用程序崩溃。只有几次,它正确地上传了图像,没有任何错误。

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("Network request failed"));
        };
        xhr.responseType = "blob";
        xhr.open("GET", uri, true);
        xhr.send(null);
    });

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

// We're done with the blob, close and release it
    blob.close();

    return await getDownloadURL(fileRef);
}
由于URI来自手机中的图像,因此uri=file:///Users/~absolute路径~/图像名称.jpg 这是Firebase的链接博览会图像拾取器 expo image picker for firebase

问题报告称, 使用类型为NSException的未捕获异常终止 由于未捕获的异常‘NSInvalidArgumentException’而终止应用程序,原因:‘-[__NSPlaceholderDictionary initWithObjects:forKeys:count:]:尝试从对象[0]中插入空对象’

编辑)我发现它可以在Android上运行,但不能在iOS上运行 对于iOS,我认为转换为BLOB是可行的。但是有错误在 const result = await uploadBytes(fileRef, blob)


解决方案

我在FireBase版本9.6.5上也遇到了同样的问题,所以我使用了函数UploadBytesResumable而不是UploadBytes,它工作得很好,如果有紧急情况,您可以暂时使用该函数,仅供参考:- https://firebase.google.com/docs/storage/web/upload-files

我只在iOS 15和15+中遇到了这个问题,其他版本低于iOS 15,在Android应用程序UploadBytes中运行正常。

注意:-当使用XMLHttpRequest和ploadBytesResumable时,第一次镜像在iOS 15.2上可以顺利上传,然后在第二次上传时,上传镜像时会崩溃。为了避免使用它, Const img=等待获取(Image_Url); Const blb=等待img.blob();

import { getStorage, ref, getDownloadURL } from "firebase/storage";

const storageRef = ref(getStorage(), "image_name");

const img = await fetch(image_url);
const blob = await img.blob();

console.log("uploading image");
const uploadTask = uploadBytesResumable(storageRef, blob);

 // Listen for state changes, errors, and completion of the upload.
uploadTask.on('state_changed',(snapshot) => {
   // Get task progress, including the number of bytes uploaded and the total number of bytes to be uploaded
   const progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
   console.log('Upload is ' + progress + '% done');
   switch (snapshot.state) {
      case 'paused':
          console.log('Upload is paused');
      break;
      case 'running':
         console.log('Upload is running');
      break;
   }
},
(error) => {
   this.setState({ isLoading: false })
   // A full list of error codes is available at
   // https://firebase.google.com/docs/storage/web/handle-errors
   switch (error.code) {
      case 'storage/unauthorized':
         console.log("User doesn't have permission to access the object");
      break;
      case 'storage/canceled':
         console.log("User canceled the upload");
      break;
      case 'storage/unknown':
         console.log("Unknown error occurred, inspect error.serverResponse");
      break;
   }
},
() => {
   // Upload completed successfully, now we can get the download URL
   getDownloadURL(uploadTask.snapshot.ref).then((downloadURL) => {
      console.log('File available at', downloadURL);
      //perform your task
   });
});

相关文章