javascript - 开放层 : 'Failed to execute ' toDataURL' on 'HTMLCanvasElement'

Question

当我尝试导出具有使用 OpenLayer 创建的多层的 map 时遇到问题。
这是我的 JS 代码:

map.once('postcompose', function(event) {
       var img = new Image,
       canvas = event.context.canvas;

       img.crossOrigin = "anonymous";
       img.src = canvas.toDataURL('image/png');
});

ma​​p 是我的 OpenLayers map 的 JavaScript 变量。
本地图由多个级别组成时，我收到这种错误:

Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported

如果尝试在不向 map 添加级别的情况下做同样的事情(仅使用默认的 OpenLayer map )，我能够生成数据 URL 并以 png 格式下载 map 。
这似乎是一个 CrossOrigin 问题，但应该在我的服务器上启用了 COR。
有什么帮助吗？谢谢!

编辑
这是 JS 代码示例，我在其中将图层添加到导致此问题的 map 。

var layer = new ol.layer.Image({
     source: new ol.source.ImageWMS({
        url: 'http://pubblicazioni.provincia.fi.it/geoserver/wms',
        params: {
                'LAYERS': 'layer_name',
                'FORMAT': 'image/png',
                'TRANSPARENT': 'true'
        },
        crossOrigin: null
     })
});
map.addLayer(layer);

Answer 1

我按照 MichaelJS 的建议解决了在我的服务器上实现本地代理的问题。
我正在运行一个 Django 应用程序，所以我从这段代码开始开发了一个自定义代理:
https://github.com/mjumbewu/django-proxy

然后在我的 urls.py 中定义了这条规则:

url(r'^proxy/(?P<url>.*)$', views.proxy_view, name='proxy'),

最后我将请求代理到 WMS 服务，以这种方式更改 JS 代码:

var layer = new ol.layer.Image({
     source: new ol.source.ImageWMS({
        url: '/proxy/http://pubblicazioni.provincia.fi.it/geoserver/wms',
        params: {
                'LAYERS': 'layer_name',
                'FORMAT': 'image/png',
                'TRANSPARENT': 'true'
        },
        crossOrigin: null
     })
});
map.addLayer(layer);

跨域问题已解决!