将图片从Google云端硬盘加载到HTML画布中会导致画布受到污染

Loading Image from Google Drive into HTML Canvas Causes Canvas to be Tainted

本文关键字：HTML 布中会 污染 布受 加载 Google 硬盘 云端      更新时间：2023-09-26

>当我像这样从谷歌云端硬盘将IMage加载到画布中时：

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

然后，当我尝试在画布上渲染此图像时，我收到一条错误消息，指出画布由于跨源错误而被污染。有没有办法让我从谷歌云端硬盘加载图像？

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

sprt.crossOrigin = "Anonymous";

包含该文件的文件夹也设置为"公共访问"。

您需要

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

您必须有一个服务器托管具有相应访问控制允许源标头的图像。 添加 crossOrigin 属性会生成请求标头。

下面是示例代码。

相关文章：