reactjs - 将 PDF 上传到 Firebase 存储 - Uncaught Error : This browser doesn't seem to support creating Blobs

Question

尝试将图像文件和 pdf 文件上传到 Firebase 存储，图像上传工作正常，而 pdf 文件上传则返回非常相似的代码

Uncaught Error: This browser doesn't seem to support creating Blobs.

NodeJS、ReactJS

请参阅下面的代码

// post resume to firebase
function PostResumeToFirebase(id, resume){
  console.log("inside PostResumeToFirebase -------")
  resume.resume_files.forEach((data) => {
    console.log("file inside post resume", data)
    const file = data
    var storageRef = firebase.storage().ref()

    // Upload file and metadata to the object
    const uploadTask = storageRef.child('applicants/resume/' + file.name).put(file);

    // Listen to state changes, errors, and completion of the upload.
    uploadTask.on(firebase.storage.TaskEvent.STATE_CHANGED,
      function(snapshot) {

        // Get task progress, inlcuding number of bytes uploaded and the total number of bytes to be uploaded

        var progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
        console.log('Upload is ' + progress + '% done');

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

      }, function(error){
        switch (error.code) {
          case 'storage/unauthorized':
            // User doesn't have permission to access the object
            console.log("storage/unauthorized", error)
            break;
          case 'storage/canceled':
            // User canceled the upload
            console.log("storage/canceled", error)
            break;
          case 'storage/unknown':
            // Unknown error occurred, inspect error.serverResponse
            console.log("storage/unknown", error)
            break;
        }

      }, function(){
        // Upload completed successfully, now we can get the download URL
        var downloadURL = uploadTask.snapshot.downloadURL;
        console.log("link to image", downloadURL)

        let resumeData = {
          user_id: id,
          resume_pdf: downloadURL
        }

      // PostPdf(resumeData)
    })

  })


}

function PostPdf(resumeData) {
  console.log("line 937", resumeData)
  $.post('https://atlas-cv-database.herokuapp.com/api/applicants/upload_pdf', resumeData)
    .done((data) => {
      console.log("yay!!! resume posted ---", data)
    })
    .error((error) => {
      console.log("noooooooooooooo")
    })

}

Answer 1

我在过去 24 小时内遇到了同样的问题，但是是在 Ionic v2/Angular 2/TypeScript 中。

this.dbsref = firebase.storage().ref();

// ... other code ...

this.dbsref.child(picPreviewName).put(byteArray).then(() => {
  console.log("Success!");
});

未捕获错误:此浏览器似乎不支持创建 Blob

我什至无法上传图片。如果我找到解决方案，我一定会在此处更新。

更新! 是的，我已经发现了问题并解决了它。 node_modules/firebase/ 中有三个文件，分别是 firebase-storage.js、firebase.js 和 storage.js 。它们是缩小版的 JavaScript。在所有这些中，搜索 n(l.Blob) 并将其替换为 n(Blob)。由于某种原因，l 对象没有 Blob 属性。无论如何，Blob 是全局范围的，因此它可以在那里进行检查。这是一个肮脏的黑客行为，但它似乎是一个 Firebase 错误。