Question

我正在尝试在on export事件处理程序中获取URL，但它会继续输出图像数据。

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;

console.log（dataUrl）行始终是图像数据，而不是真实的URL。我已将导出类型设置为“ data-url”，但仍然无法使用。

Answer 1

返回的值是一个数据URI，正如您已经指出的那样，它是图像数据作为编码字符串。 https://css-tricks.com/data-uris/提供了有关其工作方式的一些快速信息。从该页面借些信息以显示其工作方式：

您可以像这样在CSS中使用它：

body {
  background: url(data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfO...)
}

或使用如下HTML格式：

<img width="16" height="16" alt="star" src="data:image/gif;base64,R0lGODlhEAAQAMQ..." />

我认为PhotoEditorSDK不会为您托管图像；您必须将图像上传到自己的服务器并生成自己的URL。

为什么导出时无法从photoeditorsdk获取数据URL？

1 个答案: