科尔多瓦 canvas.toDataUrl()

Question

我正在制作一个在画布上组合 2 张图像的应用，并让您分享它。当从本地网络服务器运行时，它在浏览器中运行良好，但在科尔多瓦运行时不能。所有外来图像都来自远程 Web 服务器的 JSON 文件中的 SVG 的 dataURI。

流程是这样的：

1. 从远程服务器下载 SVG 的 dataURI 的 JSON 数组
2. 从相机获取图像（或返回测试图像的 dataURI 的垫片，如果 cordova 相机不可用）
3. 将照片放到画布上
4. 从列表中选择 SVG 图像（来自 dataURI 的 JSON）
5. 移动 SVG
6. 将带有canvas.toDataURL()的完整图像保存到远程服务器

所有步骤都在本地测试网络服务器上运行，并且我已经验证这两个图像都是 dataURIs（来自相机，来自远程 JSON SVG。）

在将 SVG 和相机图像放在画布上之前，我在它们上都使用了 image.crossOrigin = '';，尽管我认为我不需要这样做。

当我在第 6 步中尝试加载最终画布的 dataURI 以显示给用户时，adb logcat 中出现此错误：

Error: SECURITY_ERR: DOM Exception 18 at file:///android_asset/www/lib/ionic/js/ionic.bundle.min.js:114

这个错误应该是当您尝试访问由外国来源图像而不是 dataURIs 组成的画布图像时，对吧？我这里有什么问题吗？

我在 Android 4.4.2 上使用 Cordova 3.4.1-0.1.0

更新

另外，奇怪的是，如果我注释掉它应该使用 SVG dataURI 绘制图像的部分，它工作正常。我仔细检查了它，它确实是一个data:image/svg+xml;base64,... URI。

Answer 1

我发现 this 表明 SVG 数据URI 污染了画布。呃。

所以，基本上，我不需要为 SVG 使用 dataURI（比如附加到 DOM 的内联 SVG），或者我需要使用光栅格式。在这种情况下，我会遗憾地使用 PNG。