openlayers截图之图片跨域问题

openlayers截图之图片跨域问题

报错：

 Error in v-on handler: "SecurityError: Failed to execute 'toBlob' on 'HTMLCanvasElement': Tainted canvases may not be exported."

 原因：

引用图片资源如果跨域会污染canvas，导致canvas的toBlob、 toDataURL() 、getImageData()方法报错。

解决方法：

let map_img = new TileLayer({
  source: new XYZ({
    url: "https://t6.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=" + token,
    //！！！！！设置crossOrigin
    crossOrigin: 'anonymous',
  }),
});

　在服务上添加属性：   crossOrigin: 'anonymous'

钻研不易，转载请注明出处。。。。。。