I am trying to get a URL in the on export event handler but it keeps outputting the image data instead.
image.onload = function () {
var container = document.getElementById('photoeditorSDK')
const editor = new PhotoEditorSDK.UI.DesktopUI({
container: container,
// Please replace this with your license: https://www.photoeditorsdk.com/dashboard/subscriptions
license: 'mylicense',
editor: {
image: image,
export:{
download:false,
type:"data-url"
},
},
assets: {
// This should be the absolute path to your `assets` directory
baseUrl: '/js/photoeditorSDK/assets/'
}
});
editor.on('export', (dataUrl) => {
console.log(dataUrl);
});
}
image.crossOrigin = "anonymous";
image.src = data;
the console.log(dataUrl) line keeps being the image data instead of a real URL. I have set the export type as "data-url" and it still won't work.
The value returned is a data URI, which, as you've noted, is your image data as an encoded string. https://css-tricks.com/data-uris/ gives some quick info about how they work. Borrowing some information from that page to show how it works:
You can use it in CSS like so:
body {
background: url(data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfO...)
}
Or in HTML like this:
<img width="16" height="16" alt="star" src="data:image/gif;base64,R0lGODlhEAAQAMQ..." />
I don't believe PhotoEditorSDK hosts images for you; you'll have to upload the image to your own servers and generate your own URL.