CopyExternalImageToTexture 受到跨源数据污染

Question

问题

我上传了一个 存储库，其中隔离了我遇到的

device.queue.copyExternalImageToTexture

问题，如

index.js

文件中所示。没有服务器/后端 API。

控制台中的错误显示如下：

---

与 stackoverflow 上的此问题相关的常见解决方案是在 HTMLImageElement

img.crossOrigin = 'Anonymous'

上使用

img

。它仅在具有某些后端的设置中才有意义，但只是为了展示会发生什么：

---

问题

有什么方法可以解决这个问题，无需创建服务器/后端 API 来提供 png 文件吗？在这种情况下，我熟悉 fetch+response.blob 解决方案，但我将自己限制在这个简单的情况下，只是为了看看它是否可能。如果图像 div 已附加到文档正文，也会发生相同的错误。

干杯！

Answer 1

在 WebGL 和 WebGPU 中使用图像需要在同一域中提供它们，否则如果不是同一域，则需要服务器的许可。设置

img.crossOrigin

 只是将额外的数据发送到图像所在的服务器，以便它可以决定是否授予使用图像的权限。

在本地提供文件很简单。这里有一大堆选项

Python 的 http.server（或 SimpleHTTPServer）更快的替代品是什么？

否则，您可以禁用浏览器的安全性，但我个人不建议这样做（您需要哪些标志取决于您的浏览器）