Replacing canvas placeholders with array of external images

I have an array of remote images I want to fetch and pass into user selected placeholders. In the plugin UI I have image data, like…

const data = [ 
   {name: 'One', image: 'https://foo.com/img1.jpg'},
   {name: 'Two', image: 'https://foo.com/img2.jpg'},
]

I understand I need to fetch each one and convert to base64, along the lines of:

  fetch(url)
    .then(r => r.arrayBuffer())
    .then(a => new Uint8Array(a))

and then eventually parent.postMessage(...) with the data. But I don’t know the best way to grab the image data and prepare it to pass it through.

Check out this example: figma-plugins/fetch-image at master · rsms/figma-plugins · GitHub

Thanks. I did see that and it was helpful. My issue was that wasn’t using .then() properly after calling the function that fetched the image. I was able to eventually get it working.

This topic was automatically closed after 11 days. New replies are no longer allowed.