无法从受污染的画布下载图像;如何下载托管在Amazon s3存储桶中的Seadragon映像？

Question

我有一堆存储在亚马逊s3存储桶中的深度缩放图像，我有一个网页，用Open Seadragon dzi查看器显示它们。我能够显示图像，但我无法下载;我收到安全错误，我有一个受污染的画布。

我在存储桶中设置了CORS配置：

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>Authorization</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

允许我显示图像（之前我的OpenSeadragon调用失败，因为没有access-control-allow-origin标头），但我的画布仍然受到污染。

我尝试在seadragon查看器中设置crossOrigin策略：

var viewer = OpenSeadragon({
        crossOrigin: "Anonymous",
        id: "databaseviewer",
        prefixUrl: "../../Scripts/openseadragon/images/",
        tileSources: url,
        maxZoomLevel: 20
    });

但这并没有改变任何事情。这是我的完整脚本：

var url = '@Model.ImageUrl';

var viewer = OpenSeadragon({
    crossOrigin: "Anonymous",
    id: "databaseviewer",
    prefixUrl: "../../Scripts/openseadragon/images/",
    tileSources: url,
    maxZoomLevel: 20
});

viewer.addHandler('open', function() {                  
    var downloadlink = document.getElementById("download");
    $(downloadlink).on("click", function() {
        var img = viewer.drawer.canvas.toDataURL("image/png");
        downloadlink.href = img;
        downloadlink.download = '@Model.DatabaseName';
    });
});

Answer 1

根据API documentation，您应该将政策选项重命名为crossOriginPolicy。