将Google Drive中的图像加载到HTML Canvas中会导致Canvas被污染

Question

当我将Google图片从Google云端硬盘加载到画布中时，如下所示：

var folderID = "0B5Oh0J4bIygXUVNCa3JOVlc1WU0";
var sprt = new Image();
sprt.src = 'https://googledrive.com/host/' + folderID + '/ground1.png';

当我尝试在画布上渲染此图像时，我收到一条错误消息，指出画布因交叉原点错误而受到污染。有没有办法让我从Google云端硬盘加载图片？

我设置了以下内容，但它不起作用：

sprt.crossOrigin = "Anonymous";

包含该文件的文件夹也设置为Public Access。

Answer 1

您需要在存储桶上设置一个CORS配置，其中包含您希望与其共享存储桶的所有来源，以及您希望在该存储桶上允许的请求方法。

  

您必须拥有一个托管具有相应Access-Control-Allow-Origin标头的图像的服务器。添加crossOrigin属性会生成请求标头。

以下是示例code。