Expo application on iOS crashes when uploading video to Firebase Storage. Works on android, just not-CodePudding

I am trying to upload a video to firebase storage on iOS. Android works just fine. Here is the code causing it (there are comments in the code to show when it crashes). Also, I am using my own iPhone to test this, not a simulator.

export const mediaUpload = async (imageObject) => {
  // getting blob from a local file a user uploads from ImagePicker
  const blob = await fetch(imageObject[0].uri);
  const blobObject = await blob.blob();

  // creating reference path in storage
  const fileRef = ref(storage, `${auth.currentUser.uid}/videos/${uuid.v4()}`);
  // ----- no crash so far... -------

  // this is the issue line
  const attemptToUpload = await uploadBytes(fileRef, blobObject);
  // ------> APP CRASHES
}

On Android, this works with both images and videos. On iOS, images work but videos will crash the app completely. The blob type is video/quicktime. Why does uploadBytes method crash the app?

CodePudding user response：

I think it's a known issue on the ios platform when body is just a blob. I ran into the same problem a few weeks ago and I fixed it by sending it to my backend and then uploading to the service that requires it.

CodePudding user response：

Using this approach and works well on iOS 15.


 const videoRef = firebase.storage().ref("video/filename");

  const metadata = { contentType: "video/mp4" };

  const blob = await new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();

    xhr.onload = function () {
      resolve(xhr.response);
    };

    xhr.ontimeout = function (e) {
      // XMLHttpRequest timed out. Do something here.

      console.log(e);
    };
    xhr.onerror = function (e) {
      console.log(e);

      reject(new TypeError("Network request failed"));
    };
    xhr.responseType = "blob";
    xhr.open("GET", fileUri, true);
    xhr.timeout = 1000 * 60;
    xhr.send(null);
  });


  var uploadTask = videoRef.put(blob, metadata);

 

  uploadTask.on(
    "state_changed",
    (snapshot) => {
      // Observe state change events such as progress, pause, and resume
      // Get task progress, including the number of bytes uploaded and the total number of bytes to be uploaded
      const progress = snapshot.bytesTransferred / snapshot.totalBytes;

    

      switch (snapshot.state) {
        case firebase.storage.TaskState.PAUSED: // or 'paused'
          console.log("Upload is paused");
          break;
        case firebase.storage.TaskState.RUNNING: // or 'running'
          console.log("Upload is running");
          break;
      }
    },
    (error) => {
      console.log(error);

      // Handle unsuccessful uploads
      blob.close();
    },
    () => {
      // Handle successful uploads on complete
      // For instance, get the download URL: https://firebasestorage.googleapis.com/...
      uploadTask.snapshot.ref.getDownloadURL().then((downloadURL) => {


console.log("Video file save at:",downloadURL)
       
      });
      blob.close();
    }
  );