Ad

How To Upload Image With Shopify Polaris DropZone Component

- 1 answer

I'm using Polaris to develop an app for Shopify and need to upload an image using DropZone component, but I can't find how to get base64 file. Based on the document, in onDrop event,

I can get images files: enter image description here

and also I can convert it to blob with this code:

window.URL.createObjectURL(files[0])

then I want to convert the file to base64, How can I do this?

Ad

Answer

Polaris DropZone component works as an HTML file input, so there aren't any major differences between input and DropZone except UI and design. it returns a file object and you should load it as loading an image like this:

var reader = new window.FileReader()
reader.readAsDataURL(files[0])

now you can access to the blob and must convert this > and you should load it as loading an image like this:

var reader = new window.FileReader()
reader.readAsDataURL(files[0])

now you can access to the blob and must convert this blob to base64:

reader.onload = function () {
  var base64data = reader.result
}
Ad
source: stackoverflow.com
Ad