C#实现网页加载后将页面截取成长图片 | Playwright版
前言
如何将网页生成预览图?
要实现这个功能,可以用WebBrowser组件模拟浏览器,或者使用系统浏览器访问网页,再进行截图操作。
但是,这样需要编写大量的控制代码。
工欲善其事,必先利其器!
利用Playwright提供的强大API,可以轻松实现将网页生成预览图。
Screenshot
实现起来非常简单,直接上代码:
static async Task Main(string[] args)
{var playwright = await Playwright.CreateAsync();await using var browser = await playwright.Chromium.LaunchAsync();var page = await browser.NewPageAsync();await page.GotoAsync("https://cn.bing.com/search?q=intext%3A%22%E8%AF%B7%E5%85%B3%E6%B3%A8%E6%88%91%E7%9A%84%E4%B8%AA%E4%BA%BA%E5%85%AC%E4%BC%97%E5%8F%B7%E2%80%9DMy+IO%E2%80%9C%22");await page.ScreenshotAsync(new PageScreenshotOptions { Path = "screenshot.png", FullPage = true});
}
访问网页,截取成长图,并保存到指定路径。
API详细说明,请参看:https://playwright.dev/dotnet/docs/api/class-page#page-screenshot
Tracing
这个功能可以记录Playwright执行的所有操作流程并截图,对于获取演示素材非常有用。
下面的示例代码,记录了打开bing首页,并且执行搜索操作的全过程:
static async Task Main(string[] args)
{var playwright = await Playwright.CreateAsync();var browser = await playwright.Chromium.LaunchAsync();var context = await browser.NewContextAsync();await context.Tracing.StartAsync(new TracingStartOptions() { Screenshots =true , Snapshots =true });var page = await context.NewPageAsync();await page.GotoAsync("https://cn.bing.com/");// 输入搜索关键字await page.TypeAsync("input[name='q']", "intext:\"请关注我的个人公众号”My IO“\"");var page1 = await page.RunAndWaitForNavigationAsync(async () =>{// 点击搜索await page.ClickAsync("#search_icon");});await context.Tracing.StopAsync(new TracingStopOptions() { Path = "trace.zip" });
}
可以使用Playwright自带的view工具查看整个流程:
playwright show-trace bin\Debug\net5.0\trace.zip
也可以解压trace.zip,拿到所有的截屏图片:
结论
有了Playwright,再也不怕要求实现网页加载后将页面截取成长图片功能了。
如果你觉得这篇文章对你有所启发,请关注我的个人公众号”My IO“
C#实现网页加载后将页面截取成长图片 | Playwright版相关推荐
- C#实现网页加载后将页面截取成长图片
背景 最近再做一个需求,需要对网页生成预览图,如下图 但是网页千千万,总不能一个个打开,截图吧:于是想着能不能使用代码来实现网页的截图.其实要实现这个功能,无非就是要么实现一个仿真浏览器,要么调用系统 ...
- c# 实现网页加载后将页面截取为长图片
背景 最近再做一个需求,需要对网页生成预览图,如下图 但是网页千千万,总不能一个个打开,截图吧:于是想着能不能使用代码来实现网页的截图.其实要实现c#教程这个功能,无非就是要么实现一个仿真浏览器,要么 ...
- linux优化网页加载过程,HTML页面加载和解析流程 介绍
1.浏览器加载和渲染html的顺序 1.1.IE下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的. 1.2.在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相 ...
- python爬虫获取的网页数据为什么要加[0-[Python爬虫] 等待网页加载后再获取内容...
0x0 背景 最近在学习Python爬虫的相关知识,主要是之前有一个小idea想要用Python实现,沉寂了一年,近期终于下定决心要利用假期时间首要解决此项任务,不然拖到最后都没完成,自己遗憾不说,还 ...
- php 载入css就可以显示,如何在进度条加载后显示页面
1.思路:加入很多图片,以延迟加载时间,实现加载完后显示图片.定义一个外层p,覆盖住图片,在内层p中引入加载时显示的图片,让内层p居中在页面上,利用setInterval定时器设置3秒后将外层p隐藏, ...
- 【vue】数据加载后渲染页面
vue 想要先加载完所有数据再渲染页面 使用v-if来控制 先设置showCard为false,内容card为"" 请求成功后设置showCard为true,内容card为请求得到 ...
- 校园网DNS服务器找不到、网页加载慢、b站视频图片显示不全
自始至终我用的都是1.1.1.1和8.8.8.8的DNS,但使用校园网的情况下总会出现b站视频封面加载不出.评论笔记加载慢等问题,一直没有管过知道今天彻底上不了网了才来试着解决问题... 解决方法步骤 ...
- htmlunit爬取js异步加载后的页面
直接上代码: 一. index.html 调用后台请求获取content中的内容. <html> <head><script type="text/javas ...
- 【PHP】如何提高网页加载速度?
[php]如何提高网页加载速度? 1.减少页面请求: 从WEB运行原理上讲,IIS请求是无状态的,在服务器端一直是连接和关闭的不断进行着,如果能减少服务器请求,总的时间将会减少. 之前我下载163邮箱 ...
最新文章
- mxnet中symbol的网络结构输出(参数维度,和每层输出维度)
- 一劳永逸解决IDEA 2019.3连接MySQL80时区(serverTimezone)问题
- 第二十八讲 解非齐次线性方程组
- 用c语言计算sin x 的值,用泰勒公式求sin(x)的近似值
- matlab确定位置,Hurlin 的PSTR模型包,怎样确定位置参数个数
- 软件测试:职场上那些你不得不学会的事儿
- dup,dup2函数【转】
- 「leetcode」本周小结!(贪心算法系列四)
- 【物联网】全球SIM连接解决IoT设备换卡难问题
- Spring Boot 整合 Thymeleaf 完整 Web 案例
- 用 LSTM 预测股票价格
- 机械制图及计算机绘图试题库,机械制图及计算机绘图--试题库2016版.pdf
- Python代码画喜羊羊怎么画_卧槽!没想到,用Python竟能做五仁月饼
- pgpool-Ⅱ一主两从同步流读写分离高可用方案测试
- [SPOJ IGAME Interesting Game]Nim 博弈+数位DP
- pytorch安装教程 GPU版本
- Alcatel-Lucent 命令记录
- 疾病研究:重症肌无力医师指南
- Educational Codeforces Round 90 (Rated for Div. 2)(D 思维 E 打表)
- python字符串是有序的吗_Python之字符串
热门文章
- 第16讲 用户程序的结构与执行
- Android官方命令深入分析之Hierarchy Viewer
- 由CloudStack项目引起的ESXI嵌套虚拟化引起的二级虚拟机无法被访问
- jsp将鼠标放到那显示信息
- Linux下将数据文件的指定域读取到shell脚本中
- mysql内连接的自连接_mysql 内连接、外连接、自连接
- ssm提交post_我用spring mvc做,用post方式提交,后台获取不到参数值,用get方式就可以,什么问题...
- 第三篇.python编辑器和集成环境01
- vue 开发环境搭建
- 看出每个应用程序最高可用内存是多少