我正在尝试截取网页中 iframe 的屏幕截图。 在我的特殊情况下,iframe 包含我客户商店之一的街景 View 。 据我搜索和阅读,我没有找到任何解决方案。
我知道有 Html2Canvas
和 Canvas2Image
等 JavaScript 库,但它们无法捕获 iframe。
Here是我正在研究的 fiddle 。
这些库可以与除 iframe 之外的每个 HTML 元素一起正常工作。
这是 fiddle 的 JavaScript:
$(function() {
$("#btnSave").click(function() {
html2canvas($("#widget"), {
onrendered: function(canvas) {
var context=canvas.getContext("2d"); // returns the 2d context object
// Convert and download as image
theCanvas = canvas;
document.body.appendChild(canvas);
// Convert and download as image
Canvas2Image.saveAsPNG(canvas);
$("#img-out").append(canvas);
}
});
});
});
是否有其他捕获 iframe 的方法? 是否有任何付费第三方服务可以执行此操作?
如果 iframe 没有任何效果,是否有任何替代方法可以实现我正在尝试做的事情?
如果需要更多信息,请告诉我。
任何帮助将不胜感激。
提前致谢
最佳答案
如果您需要以编程方式进行捕获,您可以选择将 nodejs 与 puppeteer 结合使用,puppeteer 是一个使用 chromium 来模拟网络浏览器的库。我给你一个捕获屏幕的例子:
const puppeteer = require('puppeteer');
async function run() {
let browser = await puppeteer.launch({ headless: false });
let page = await browser.newPage();
await page.goto('https://www.scrapehero.com/');
await page.screenshot({ path: './image.jpg', type: 'jpeg' });
await page.close();
await browser.close();
}
run();
这是我的来源: https://www.scrapehero.com/how-to-take-screenshots-of-a-web-page-using-puppeteer/
关于javascript - 是否可以在网页中截取 iframe 的屏幕截图?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56543686/