html2canvas 跨域打印天地图页面空白问题记录

使用到的插件是 html2canvas 参考链接 和 print-js 参考链接

问题描述： 打印地图空白，报错

解决办法： openlayer：crossOrigin: "anonymous"配置。

let printElem = document.getElementById("PrintMain");
let opts = {
  allowTaint: true, //
  useCORS: true, // 
  tainttest: true,
  backgroundColor: null,
};
html2canvas(printElem, opts).then((canvas) => {
  // console.log("canvas", canvas, canvas.toDataURL("image/png"));
  Print({
    printable: canvas.toDataURL("image/png"),
    type: "image",
  });
});

//初始化图层
let layer = new Tile({
    id: d.id,
    zIndex: layerIdx + 1,
    source: new WMTS({
        url: mapimgUrl,
        layer: layerVal,
        matrixSet: 'w',
        format: 'tiles',
        style: 'default',
        projection: projection,
        tileGrid: new WMTSTileGrid({
            origin: getTopLeft(projectionExtent),
            resolutions: resolutions,
            matrixIds: matrixIds,
        }),
        wrapX: true,
        crossOrigin: "anonymous", // 解决代码
    }),
    visible: true
})