将PDF上传到Firebase存储 - 未捕获错误:此浏览器似乎不支持创建Blob

时间:2016-12-01 18:31:26

标签: reactjs firebase firebase-storage uncaught-typeerror

尝试将图像文件和pdf文件上传到Firebase存储,图像上传工作完美,而pdf文件上传时返回的代码非常相似

  

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

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")
    })

}

3 个答案:

答案 0 :(得分:6)

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

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

// ... other code ...

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

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

我甚至无法上传图片。如果我找到解决方案,请务必在此处更新。

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

答案 1 :(得分:2)

我在firebase@3.6.2上遇到同样的问题,我已降级为firebase@3.5.3,现在一切都很好。

答案 2 :(得分:0)

就像我上面的情况一样,我在firebase@3.6.2上遇到了同样的问题 我已升级到firebase@3.6.4,我无法再复制错误。