3

我在将 S3 托管的 JPG 作为纹理加载到我的 three.js 模型中时遇到问题。我在 Chrome 中遇到了 CORS 错误,意识到 S3 支持 CORS,并在开发过程中采用了非常宽松的政策来检查它(我以前从未遇到过 CORS)。Firefox 很好,但 Chrome 和 Safari 仍然出错。

JPG 通过 THREE.ImageUtils.loadTexture() 加载到纹理中,然后将该纹理应用于材质。

我尝试在加载之前将以下内容添加到图像中,但它似乎不起作用:

img.crossOrigin = '';

我目前的 CORS 政策是开放的:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>PUT</AllowedMethod>
        <AllowedMethod>POST</AllowedMethod>
        <AllowedMethod>HEAD</AllowedMethod>
        <AllowedMethod>DELETE</AllowedMethod>
    </CORSRule>
</CORSConfiguration>

Chrome的错误是

38 Cross-origin image load denied by Cross-Origin Resource Sharing policy.

任何人都可以给我任何提示吗?

更新:

所以事实证明,我只是没有足够早地在代码中设置 img.crossOrigin 以使其有用。愚蠢的错误:(

AllowHeader 提示很有用,谢谢!

4

1 回答 1

1

尝试在标题中添加 Content- 。

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
  <CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedHeader>Content-*</AllowedHeader>
    <AllowedHeader>Host</AllowedHeader>
  </CORSRule>
</CORSConfiguration>
于 2012-10-12T09:00:59.363 回答