Lazy loaded image
浏览器自动化
Chrome DevTools协议长截图无法截全解决方案
字数 189阅读时长≈ 1 分钟
2025-3-19
2025-3-19
1
type
status
date
slug
summary
tags
category
icon
password

结论

使用 Page.captureScreenshot 截长图时,部分网页只能截当前可视窗口,无法将所有内容截全,究其原因是因为 外层元素css样式 [ height: 100% | height: 100dvh] 使我们只能获取到可视窗口的高度。
notion image
notion image

举例

用 claude 网站举例,cdp命令 > full size screenshot,只能截当前页面。
notion image
notion image
 
去除外部标签中的 height == 100dvh,
function removeSpecificProperty() { const styleSheets = document.styleSheets; for (let i = 0; i < styleSheets.length; i++) { const styleSheet = styleSheets[i]; try { const rules = styleSheet.cssRules || styleSheet.rules; for (let j = 0; j < rules.length; j++) { const rule = rules[j]; if (rule.selectorText === '.h-screen' && rule.style.getPropertyValue('height') === '100dvh') { rule.style.removeProperty('height') } } } catch (error) { console.error(`处理样式表${styleSheet.href||'内联样式表'}时出错:`, error) } } } removeSpecificProperty()
notion image
上一篇
Quark网盘Python脚本
下一篇
渲染页面:浏览器的工作原理(转)

评论
Loading...