Javascript jCrop HTML5画布Base64

我正在尝试使用jCrop和canvas

我尝试使用canvas直接裁剪图像，而不是将图像发送到服务器并再次使用裁剪后的图像进行裁剪，因为结果是，我在base64图像中转换裁剪并发送到服务器

我有

我裁剪图像，然后在画布中转换，但我无法在base64中转换图像。出现以下错误：

"SecurityError: The operation is insecure."

我试过

console.log(canvas.toDataURL());

---

我做错了什么？

一般来说，这个问题是由于没有满足跨源资源共享要求

要避免这种情况，您可以：

提供从与页面相同的原点剪切的图像 通过向图像提供crossOrigin属性请求跨原点使用 使用代理从外部站点通过服务器为映像提供服务，在这种情况下，在本地执行所有操作时，大部分点都会丢失。 此外：

测试时，不要使用本地file://协议，而是使用轻型本地服务器ie。 否则，每次使用toDataURL或getImageData时都会出现安全错误

关于从外部服务器请求CORS使用：您只能请求此类使用，但这取决于服务器是否授予权限

请求：

<img src="..." crossOrigin="anonymous" >

---

如果拒绝，则根本不会加载图像。

我遇到了这个问题。问题是，当你的画布上已经有了一些东西，然后把其他东西放在画布上，它就会被污染。我的解决方法是删除canvas元素并替换它，然后在其上放置一个新图像

var img = new Image;

img.onload = handleOnLoad;
img.crossOrigin = 'anonymous';
img.src = '...';