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'

 

 

鑽研不易，轉載請註明出處。。。。。。

 

 

 

 

 

 

翻譯

搜索

複製