将blob数据上传到Cloudinary

时间:2016-09-28 21:47:31

标签: javascript image meteor blob cloudinary

我有一个Meteor应用程序,我正在尝试从.epub文件中提取一些图像,然后将它们保存到Cloudinary,但我没有运气。这是我到目前为止所做的:

使用epub.js我加载.epub文件并读取图像数据:

 const book = ePub('path_to_file.epub');
 const cover = book.coverUrl();
/* cover._result returns this:
"blob:http://localhost:3000/6433bd4e-13dc-462b-b7be-e9654ad06c18"
*/

我可以手动将cover._url指定给图像源,图像会按预期呈现:

  $('#bookImage').attr('src', cover._result)

我试图像这样上传cover._result"blob:http://localhost:3000/6433bd4e-13dc-462b-b7be-e9654ad06c18"

  Cloudinary.upload( cover._result,{
    folder: 'Books',
    resource_type: 'raw',
  },function(err, res){ 
    if (err){ 
      console.log(err); 
    } else { 
      console.log(res);
       } 
     });

我没有回复

我也试过这个:

const myFile = new File([cover._result], "new_file.jpg", {type: "image/jpg"}); 
Cloudinary.upload( myFile,{...})

文件上传,但是它的垃圾数据不可读

最后,我尝试将文件转换为base64,如下所示:

 const toDataUrl = function(cover, callback) {
 const xhr = new XMLHttpRequest();
  xhr.responseType = 'blob';
  xhr.onload = function() {
    var reader = new FileReader();
    reader.onloadend = function() {
      callback(reader.result);
    }
    reader.readAsDataURL(xhr.response);
  };
  xhr.open('GET', cover);
  xhr.send();
}

/******************/
      toDataUrl (cover._result, function( base64Img ) {
        Cloudinary.upload( base64Img,{
          folder: 'Books',
           resource_type: 'raw',
         },function(err, res){ 
            if (err){ 
              console.log(err); 
            } else { 
              console.log(res);
            } 
        });
    })

我没有收到Cloudinary.upload函数的回复。

我的问题是,Cloudinary是否支持此类功能?

感谢。

解决

这是Meteor包本身的一个问题。

我不得不改变这个:

  toDataUrl (cover._result, function( base64Img ) {
    Cloudinary.upload( base64Img,{
      folder: 'Books',
       resource_type: 'raw',
     },function(err, res){ 
        if (err){ 
          console.log(err); 
        } else { 
          console.log(res);
        } 
    });
})

到此:

  toDataUrl (cover._result, function( base64Img ) {
    Cloudinary._upload_file( base64Img,{
      folder: 'Books',
     },function(err, res){ 
        if (err){ 
          console.log(err); 
        } else { 
          console.log(res);
        } 
    });
})

上传的图片数据没有问题。

1 个答案:

答案 0 :(得分:0)

我不得不改变这个:

  toDataUrl (cover._result, function( base64Img ) {
    Cloudinary.upload( base64Img,{
      folder: 'Books',
       resource_type: 'raw',
     },function(err, res){ 
        if (err){ 
          console.log(err); 
        } else { 
          console.log(res);
        } 
    });
})

到此:

  toDataUrl (cover._result, function( base64Img ) {
    Cloudinary._upload_file( base64Img,{
      folder: 'Books',
     },function(err, res){ 
        if (err){ 
          console.log(err); 
        } else { 
          console.log(res);
        } 
    });
})