是否可以对网页中的 iframe 进行截图?

2024-01-15

我正在尝试截取网页中 iframe 的屏幕截图。 在我的特定情况下,iframe 包含我的一位客户商店的街景视图。 据我搜索和阅读,我没有找到任何解决方案。

我知道有像这样的 JavaScript 库Html2Canvas and Canvas2Image,但他们无法捕获 iframe。

Here http://jsfiddle.net/adrianogiannacco/9zr83mvj/是我正在研究的小提琴。

这些库可以与除 iframe 之外的每个 HTML 元素一起正常工作。

这是小提琴的 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 来模拟 Web 浏览器的库。我给你举一个截屏的例子:

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/ https://www.scrapehero.com/how-to-take-screenshots-of-a-web-page-using-puppeteer/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

是否可以对网页中的 iframe 进行截图? 的相关文章

  • 限制 Dropzone 仅上传特定类型的文件

    我正在使用 Dropzone 上传文件 这是我的代码 div div
  • window.open:是否可以打开一个新窗口并修改其 DOM

    我想打开一个新窗口 var my window open iframe html blank height 600 width 600 但当我打开它时 我想修改它的DOM 我尝试过 var div my document createEle
  • JavaScript:常量属性

    在javascript中 我可以将对象的属性声明为常量吗 这是一个示例对象 var XU Cc Components classes or function aXU this Cc Components classes var XU new
  • setInterval() 在用户离开选项卡时暂停?

    javascript 中是否有任何方法的行为类似于 setInterval 并且当用户离开选项卡时停止并在用户再次进入选项卡时恢复 您可以使用以下方法创建自己的 API可见性API https developer mozilla org e
  • 将异步事件监听器与 Nestjs EventEmitter 模块和无服务器函数结合使用

    我正在尝试在 Nestjs EventEmitter 模块的帮助下实现具有无服务器 lambda 函数的异步工作线程 处理程序在发出事件时被调用 但该函数在 async await 调用之前关闭 我尝试过同时使用emit and emitA
  • 如何知道浏览器空闲时间?

    如何跟踪浏览器空闲时间 我用的是IE8 我没有使用任何会话管理 也不想在服务器端处理它 这是纯 JavaScript 方法来跟踪空闲时间 并在达到一定限制时执行一些操作 var IDLE TIMEOUT 60 seconds var idl
  • 自定义指令链接中的 element.replaceWith 仅在第一次调用时有效

    我是 Angularjs 的新手 不太了解幕后的情况 基本上我想创建一个 E 扭结指令 基于控制器中的数据 我动态创建html 就像整个 表 一样 以替换该指令 我的 html 文件中的指令是这样的
  • PHP 共享标头而不使用服务器端脚本?

    到目前为止我总是通过 PHP 解决简单的问题 您有一个包含页眉 菜单 页脚和内容字段的网站 每个页面的页眉 菜单和页脚通常是相同的 在没有 PHP 或任何其他服务器端语言的情况下 如何使页眉 菜单和页脚数据仅存在于一个文件中 例如 您不会有
  • JavaScript 提升解释

    下面的片段有什么区别 var a 0 function b a 10 return function a b console log a gt 10 and var a 0 function b a 10 return function a
  • Android中webview的截图方法

    我在 webview 中的 html5 canvas 上画了一些线 并尝试使用下面的代码截取 webview 的屏幕截图 WebView webView WebView findViewById R id webview webView s
  • 不使用控件时,视频元素在 Chrome 中消失

    So I think这是一个浏览器错误 它出现在一个更复杂的设计 网站中 但我已经进行了很好的尝试 简化了我的代码和设计等 并发现了以下内容 嵌入时
  • Django 将 JSON 数据传递给静态 getJSON/Javascript

    我正在尝试从 models py 中获取数据并将其序列化为views py 中的 JSON 对象 模型 py class Platform models Model platformtype models CharField max len
  • 具有固定顶部菜单的语义 UI 侧边栏

    Semantic UI 对其进行预警侧边栏页面 http semantic ui com modules sidebar html usage 当侧边栏出现时 固定位置内容可能会出现改变其位置的问题 然后它提供了该问题的两种可能的解决方案
  • DOM 解析器 Chrome 扩展内存泄漏

    问题 我开发了一个扩展程序 可以拦截 Web 请求 获取 Web 请求来源的 HTML 并对其进行处理 我使用 DOMParser 来解析 HTML 并且意识到 DOMParser 正在导致大量内存泄漏问题 最终导致 chrome 扩展崩溃
  • 如何获得 JavaScript 阶乘程序的循环来显示所使用的工作?

    你好 我面临着用 JavaScript 编写一个程序的挑战 尽管我对它不太了解 但它要求用户输入一个数字 然后计算该数字的阶乘 我使用了已经提出的问题并设法使计算正常工作 但无法获得所需的输出 我必须在以下输出中获取它 而不使用任何花哨的库
  • 正则表达式上的换行符

    我试图替换两个标签之间的所有内容 但我无法构建正确的表达式 这就是我所做的
  • 如何设置 CSS 网格的最大高度

    我有以下 CSS 网格 grid 3x4 display grid grid template columns 1fr 1fr 1fr grid template rows 1fr 1fr 1fr 1fr grid template are
  • 在 Node.js 中,setTimeout() 会阻止事件循环吗?

    如果我有一个简单的 setTimeout 函数 并将其设置为 10 秒 整个服务器在那10秒内就死机了 这是真的 这就是我听到的 答案是no 你的链接是什么Node js 如何重新创建 setTimeout 函数而不阻塞事件循环 https
  • Javascript 在没有 id 的情况下取消标记跨度

    是否可以找到并取消标记字符串中没有 id 的跨度 我有一个文本 其中有一堆跨度 其中一些有 id 另一些则没有 Input span Hi there span span This is a test span Output Hi ther
  • 如何在Rails中使用jquery tokeninput?

    我正在尝试在我的应用程序的表单中添加 tokeninput jquery 字段 该字段允许用户发布状态更新 我希望用户能够将作品 单独的模型 附加到状态更新中 我正在使用 act as taggable on gem 并且我的查询指定标签上

随机推荐

  • 如何在 uitextfield 中显示 pickerview 而不是键盘?

    我想在成为 UITextfield 而不是键盘的 FirstResponder 时显示 UIPickerView 并在选择器视图的文本字段中填充值 有人知道吗 使用 textfield InputView uipickerView 替换系统
  • SmtpClient“由于数据包格式意外,握手失败”

    我使用 SmtpClient 发送电子邮件 代码如下 SmtpClient client new SmtpClient host 587 client EnableSsl true client Credentials new System
  • 如何从一个Windows控制台应用程序向另一个应用程序发送消息?

    我有一个启动子进程的 Windows 控制台应用程序 如何向子进程发送消息 我发现类似的功能PostMessage PeekMessage http msdn microsoft com en us library windows desk
  • Java 中缺失值

    Java中可以用什么语句来表示变量的缺失值 比如我想写一段代码 if a gt 23 income pay rate else income is missing 这个线程中有很多不好的建议 首先让我谈谈为什么你应该not采取一些建议的方法
  • 将 Golang JSON 存储到 Postgresql 中

    我想将某个结构存储到我的数据库中 其中有一个 JSON 字段 type Comp struct CompId int64 db comp id json comp id StartDate time Time db start date j
  • stack.yaml 文件和 .cabal 文件有何区别?

    我最近开始在为项目指定外部依赖项时使用 Haskell 堆栈 有时您将其放置在 cabal 文件中 而有时您将其放置在 yaml 文件中 我是否正确地认为 当您将其放入 cabal 文件中时 它只会在堆栈存储库中查找您的包 但是 当您将其放
  • Android SDK Manager 安装特定版本的 NDK Bundle

    我正在尝试安装 NDK 15c 但我似乎不知道如何告诉 sdkmanager 版本 如果我跑 sdkmanager ndk bundle 我会得到我不想要的最新的 我尝试了不同的组合 但没有任何效果 sdkmanager ndk bundl
  • Akka actor 查找或依赖注入

    我刚刚开始使用 Akka 我无法决定是否应该使用依赖注入 如蛋糕模式 或 actor 查找来将 actor 彼此解耦 首选方法是什么 您应该更喜欢向彼此介绍 Actor 这意味着在消息中发送 ActorRef 或与消息一起发送 或者将其传递
  • CouchDB 中的树

    我是 CouchDB 新手 有一个问题 我正在使用父消息的 ID 作为属性来保存消息 消息还可以有一个 childMessage 作为父级 因此它看起来像一棵树 我如何查询所有孩子 包括孩子的孩子 谢谢 这是处理分层数据时常用的方法 htt
  • Rails 如何优化我的网站?

    我想让我的网站更快 我知道我可以制作 CSS 精灵并压缩 HTML 和 CSS 还有其他方法可以优化页面速度吗 此页面就是一个示例 http www vinderhimlen dk konkurrencer vind elektronik
  • 如何防止 BeautifulSoup4 在汤中添加额外的 标签? [复制]

    这个问题在这里已经有答案了 在 BeautifulSoup 3 之前的版本中 我可以获取任何 HTML 块并通过以下方式获取字符串表示形式 from BeautifulSoup import BeautifulSoup soup3 Beau
  • 使用 PHP 确定本地文件的 Mime 类型(内容类型)

    我正在尝试确定文件的 mime 类型 我尝试了几种方法 但没有想出任何可以提供一致输出的方法 我试过了 mime mime content type file and mime exec file bi file 我正在提供图像 CSS 和
  • 如何在Qt5中播放声音(Qt4迁移)?

    在Qt4中我曾经使用过 QT multimedia phonon include
  • 安全性:我应该如何存储(“记住”)用户的用户名和密码以供将来使用?

    我需要我的应用程序能够记住用户的用户名和密码 以便用户将来不必再次输入 显然 为了 记住 用户名和密码以供将来使用 这意味着我的应用程序必须以某种方式将用户名和密码存储到磁盘 这通常是如何完成的 我知道 Pidgin 以纯文本形式存储用户名
  • 高阶函数有哪些有趣的用途?

    我目前正在学习函数式编程课程 我对高阶函数和一等公民函数的概念感到很有趣 然而 我还想不出许多实际有用的 概念上令人惊奇的或只是简单有趣的高阶函数 除了典型的 相当沉闷的map filter等功能 您知道此类有趣函数的示例吗 也许是返回函数
  • 图像和 div 的最大可能尺寸扩展以填充空间

    我确信以前有人问过这个问题 但我找不到确切问题的答案 我想要一个非常简单的布局 header content graphic where 页眉高度由字体大小设置 内容有固定的最小宽度 考虑到这两个限制并保持纵横比 图形尽可能大 即 它将与屏
  • jqGrid 子网格的 JSON 对象

    这是我关于 jqGrid 子网格的 JSON 数据的第三个问题 到目前为止我还没有得到任何评论 请有人帮忙 my 第一个问题 https stackoverflow com questions 6647302 subgrid in jqgr
  • GetHashCode() 经常重写碰撞方式

    我正在使用 Unity 而 Unity 中没有元组 因此我创建了自己的元组类来工作 因为我的字典需要它 Dictionary
  • 从特定链接读取流

    我需要使用 OpenCV 库从 mjpeg 读取流 更详细的信息 我需要阅读http 194 126 108 66 8887 但是当我尝试这样做时 VideoCapture ipCam ipCam open http 194 126 108
  • 是否可以对网页中的 iframe 进行截图?

    我正在尝试截取网页中 iframe 的屏幕截图 在我的特定情况下 iframe 包含我的一位客户商店的街景视图 据我搜索和阅读 我没有找到任何解决方案 我知道有像这样的 JavaScript 库Html2Canvas and Canvas2