blueimp/JavaScript-Load-Image

Error: TypeError: data.image.toBlob is not a function

yourchoice opened this issue · 3 comments

When I upload a file image, i get this error

Error: TypeError: data.image.toBlob is not a function

$('.wrapper').on('change', 'input[type=file]', function(e) {
loadImage(e.target.files[0], { meta: true })
  .then(function (data) {
    if (!data.imageHead) throw new Error('Could not parse image metadata')
    return new Promise(function (resolve) {
      data.image.toBlob(function (blob) {
        data.blob = blob
        resolve(data)
      }, 'image/jpeg')
    })
  })
  .then(function (data) {
    //here i try to get data.blob
  })
  .catch(function (err) {
    console.error(err)
  });
});

I see that there need to add in param { canvas: true } and working , so i think can be closed

Is there a way in then(function (data) { ... }) to convert data.blob in base64 ? I would like to prefill an hidden input with base64...

Hi @yourchoice,

canvas data can be exported as base64 URL:
https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL

I recommend you to bookmark https://developer.mozilla.org/, as it's a great documentation resource for JavaScript and has a good search function that will allow you to find answers to your question on your own.