我的团队目前正在开发一个具有 Angular 7 前端和 .net core 2.1 后端的 Web 应用程序。我需要做的任务之一是抓取屏幕截图并将其附加到电子邮件中。 Web 应用程序有一个 esri 地图。
为了捕获屏幕截图，我使用 html2canvas 包。除了不捕获 esri 地图内容的部分之外，它按预期工作。它捕获除 esri 地图之外的所有其他内容。
对于 html2canvas 函数调用，我将allowTaint 属性和useCORS 属性设置为true。我做了一些进一步的研究，发现了 html2canvas 的代理属性。这让我想到，这可能是地图未生成的原因。我似乎找不到任何关于如何设置 arcgis 代理的明确说明。我想知道是否有人可以帮助我解决这个问题。
任何指导或帮助将不胜感激。
以下代码片段是我的 html2canvas 调用。html2canvas
html2canvas(document.getElementById('mapContainer'), { useCORS: true, logging: true, allowTaint: true }).then((canvas) => {
console.log("Document html2canvas");
console.log(document);
screenCapture = canvas.toDataURL();
]);
2018 年 1 月 11 日更新
我就此事联系了 Esri，他们的回应是，我们不支持 Angular 7，我们只支持 Javascript。我问他们，如果我使用打印任务而不是 html2canvas 会怎么样。
这是我使用打印任务的代码片段。希望这可以帮助某人。
这是我在其中一个服务中编写的用于捕获地图的函数。看起来效果很好。我不知道使用 arcgis 提供的实用任务 url 或使用您自己的服务器来渲染这些屏幕截图是否有任何开销。由于某种原因，当我使用我的服务器打印任务实用程序 URL 时，它不起作用。
注意：下面的代码片段=>是箭头函数=>
screenCapture(): Promise<any> {
return new Promise((resolve, reject) => {
loadModules(['esri/tasks/PrintTask', 'esri/tasks/support/PrintTemplate', 'esri/tasks/support/PrintParameters']).then(([PrintTask, PrintTemplate, PrintParameters]) => {
try {
var printTask = new PrintTask({
url: 'https://utility.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task/',
updateDelay: '3000'
});
var template = new PrintTemplate({
layout: "map_only",
exportOptions: {
dpi: 96,
width: 1871,
height: 800
},
});
var params = new PrintParameters({
view: this.mapView,
template: template
});
printTask.execute(params).then(res => { console.log(res); resolve(res); });
}
catch (error) {
console.log(error);
reject(error);
}
});
});
} // end ofScreenCapture
