Please include base-64 utilities

#1

Since ImageFill takes a data: URI with base-64 encoded data, and what’s gotten from the web with a fetch is usually binary data, it’d be great if Xd provided utilities to convert binary to and from base-64.

#2

Thanks for the request. For now, please use a utility function. Example: https://github.com/AdobeXD/plugin-samples/blob/master/how-to-make-network-requests/main.js

#3

Thought I’d let you know (a bit later!) that using the npm module base64-arraybuffer works great.

The code

import base64 from 'base64-arraybuffer'

const binary = await fetchBinary(uri)
const imgBase64 = base64.encode(binary)
const imgFill = new ImageFill('data:image/png;base64,' + imgBase64)

seems to work great (using the fetchBinary utility from the plugin-samples). Not bad! 3 lines of code to fetch an image and turn it into an ImageFill.

1 Like
Problem with generating pixel representation of image upload in Adobe XD
#4

But here’s a strong vote for a built-in fast (C++) base64 implementation that handles both string and arraybuffer encoding/decoding.

(You probably already have much of that built-in, handling the “data:” URIs, so you could expose it to JS.)