Azure 存储 Blob CORS 错误

Question

我有一个 Azure 存储帐户（经典），我通过门户以这种方式启用了 CORS：

现在我有一个 Flutter Web 应用程序 (PWA) 需要从这个存储中获取一些图像，但它会出现 CORS 错误。

我还尝试了一个带有简单 jquery ajax 调用的测试网页，我得到了同样的错误。这是 jquery 代码：

$.ajax({
        url: 'https://xxxx.blob.core.windows.net/test.jpg',
        type: 'get',
        success: function(data, status) {
            console.log("Status: "+status+"\nData: "+data);
        },
        error: function (result) {
            console.log(result);
        }           
     });

错误信息是：

Access to XMLHttpRequest at 'https://xxxx.blob.core.windows.net/test.jpg' from origin 'https://zzz.azurewebsites.net' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

如何添加响应 Header：access-control-allow-origin：*

谢谢。

Answer 1

如 chat 中所述，您的 CORS 配置非常好。您运行遇到的问题是因为浏览器缓存了 CORS 设置。我们发现了两件事：

CORS 设置的最长期限设置为非常高的值（86400 秒），这会使浏览器缓存 CORS 设置的时间更长。删除 CORS 设置并使用较低的最大年龄值重新创建它以及删除浏览器缓存将解决此问题。
在第二个浏览器中尝试 AJAX 请求总是有帮助的，以防第一个浏览器缓存了 CORS 设置。

Azure 存储 Blob CORS 错误

Azure Storage Blob CORS errors

azure

azure-storage

cors

azure-blob-storage

flutter-web