影刀RPA实操指南长页面全屏截图与滚动截图——网页截图的各种场景应对做自动化运营的同学经常有这个需求把整个网页截下来生成一份完整的页面快照。比如竞品详情页一次性截取所有内容方便对比自己的店铺首页截全貌给老板看订单详情页整个页面存证但问题来了大部分网页都很长浏览器一屏显示不完。影刀自带的截图指令只能截当前可视区域下面的内容怎么办这篇文章把网页截图的所有场景和方法一次讲透。场景分类先搞清楚你的真实需求是什么场景需求推荐方案截取可视区域只截看得到的影刀内置截图指令截取某个元素比如商品主图影刀元素截图指令截取整个网页从顶到底浏览器全页截图截取长图带滚动比如超长表格Selenium截图需要高精度用于存档或OCRPython 截图库方案一影刀内置截图指令最简单影刀的浏览器自动化里有两个截图指令截图指令截取当前浏览器可视区域。操作步骤打开目标网页等待页面加载完成使用截图指令 → 选择保存路径拼多多店群自动化上架方案就得到了当前屏幕能看到的区域局限只能截一屏。如果页面有三屏高只截到第一屏。元素截图指令截取指定元素的区域。适用场景只想要商品主图、订单表格、图表区域等特定元素的截图。方案二浏览器开发者工具全页截图零编码在Chrome中这是最无损的长截图方案按F12打开开发者工具按 CtrlShiftPWindows或 CmdShiftPMac输入 “screenshot” → 选择“Capture full size screenshot”Chrome会自动滚动并拼成一张完整的页面截图保存到下载目录在影刀中自动化这个操作影刀可以直接用发送快捷键模拟开发者工具的操作1. 打开目标网页 2. 发送快捷键F12打开开发者工具 3. 等待2秒 4. 发送快捷键CtrlShiftP 5. 等待1秒 6. 模拟输入Capture full size screenshot 7. 发送按键Enter 8. 等待3秒 9. 从浏览器下载目录移动截图到目标位置注意这个方法依赖Chrome界面网速慢或者电脑卡的时候等待时间可能需要加长。方案三Python Selenium实现滚动截图精确控制如果你需要对截图过程有精确控制或者需要截取比浏览器全页截图更长的内容用Python代码。先安装所需库在影刀中执行Python代码块需要先确保环境中有以下库# 在影刀的Python环境中安装如果还没装# pip install selenium Pillow完整代码分段截图拼接fromseleniumimportwebdriverfromselenium.webdriver.common.byimportByfromPILimportImageimporttimeimportosdefcapture_full_page_screenshot(url,output_path,scroll_step800): 分段截取网页并拼接成长图 url: 目标网页地址 output_path: 输出图片路径 scroll_step: 每次滚动的像素高度默认800 driverwebdriver.Chrome()driver.get(url)time.sleep(3)# 等待页面加载# 获取页面总高度total_heightdriver.execute_script(return document.body.scrollHeight)viewport_heightdriver.execute_script(return window.innerHeight)screenshots[]current_position0whilecurrent_positiontotal_height:# 滚动到指定位置driver.execute_script(fwindow.scrollTo(0,{current_position}))time.sleep(0.5)# 等待渲染# 截图screenshot_pathfscreenshot_part_{current_position}.pngdriver.save_screenshot(screenshot_path)screenshots.append(screenshot_path)current_positionscroll_step# 拼接所有截图images[Image.open(p)forpinscreenshots]# 计算总宽度和总高度处理重叠部分total_widthmax(img.widthforimginimages)total_height_canvassum(img.heightforimginimages)-(len(images)-1)*(scroll_step-viewport_height)resultImage.new(RGB,(total_width,int(total_height_canvas)))y_offset0fori,imginenumerate(images):ifilen(images)-1:# 最后一张只取从重叠点到底部的部分overlapscroll_step-(viewport_heightifi0else0)crop_topmax(0,img.height-(total_height-current_positionscroll_step))result.paste(img.crop((0,crop_top,img.width,img.height)),(0,y_offset))else:result.paste(img,(0,y_offset))y_offsetscroll_step result.save(output_path)# 清理临时文件forpinscreenshots:os.remove(p)driver.quit()returnoutput_path# 调用示例capture_full_page_screenshot(https://example.com/product/12345,rD:\screenshots\product_full.png)这段代码的核心逻辑把页面从上到下分成多段每段截一张图然后像拼拼图一样把截到的图片拼接起来。注意事项滚动步长step太大 → 可能漏掉内容step太小 → 截图太多、拼接慢。一般设置为浏览器窗口高度的80%左右。异步加载有些网页内容是随着滚动动态加载的比如微博、抖音的无限滚动。这种页面需要先滚动到底部触发所有内容加载再分段截图。固定元素很多网页顶部有固定导航栏、底部有固定客服按钮。分段截图时这些元素会出现在每一张截图中导致拼接后导航栏和客服按钮出现多次。可以通过CSS隐藏它们driver.execute_script( var fixed document.querySelectorAll(.fixed-header, .fixed-footer, .sticky, .float-bar); fixed.forEach(function(el) { el.style.display none; }); )方案四影刀调用浏览器自带的截图APIChrome DevTools ProtocolCDP提供了Page.captureScreenshot方法可以截取完整页面。在影刀中如果你用的是影刀内置浏览器可以尝试在流程中加入JavaScript代码块TEMU店群如何管理运营// 这个方案依赖浏览器是否支持CDP测试环境可能不可用// 如果不行就用方案三这个方法比较不稳定不同版本的影刀浏览器支持情况不同推荐优先使用方案三。截图后的常见处理添加水印截图存证时通常需要加水印fromPILimportImage,ImageDraw,ImageFontdefadd_watermark(image_path,text,output_path):imgImage.open(image_path)drawImageDraw.Draw(img)# 在右下角添加半透明文字fontImageFont.truetype(simhei.ttf,30)text_widthdraw.textlength(text,fontfont)ximg.width-text_width-50yimg.height-80draw.text((x,y),text,fontfont,fill(255,255,255,128))img.save(output_path)压缩图片长截图文件往往很大几MB甚至十几MB发送前可以压缩img.save(output_path,quality60,optimizeTrue)写在最后网页截图看似简单实际上场景差异很大。记住三个选型原则简单快照→ 影刀内置截图指令就够了长页面→ Chrome全页截图或Selenium分段拼接需要处理、加水印→ Python PIL方案大部分RPA自动化场景里用的是第二个方案Chrome全页截图。它零编码、质量高、速度快。只有在需要精确定制比如去掉导航栏、加水印时才上Python方案。内容标签影刀RPA · 网页截图 · 长图拼接 · Selenium · 页面快照 · 数据存证作者林焱系列说明本文是「影刀RPA新手到高手」系列教程之一面向需要制作页面快照的运营和开发者。
影刀RPA实操指南_长页面全屏截图与滚动截图网页截图的各种场景应对
影刀RPA实操指南长页面全屏截图与滚动截图——网页截图的各种场景应对做自动化运营的同学经常有这个需求把整个网页截下来生成一份完整的页面快照。比如竞品详情页一次性截取所有内容方便对比自己的店铺首页截全貌给老板看订单详情页整个页面存证但问题来了大部分网页都很长浏览器一屏显示不完。影刀自带的截图指令只能截当前可视区域下面的内容怎么办这篇文章把网页截图的所有场景和方法一次讲透。场景分类先搞清楚你的真实需求是什么场景需求推荐方案截取可视区域只截看得到的影刀内置截图指令截取某个元素比如商品主图影刀元素截图指令截取整个网页从顶到底浏览器全页截图截取长图带滚动比如超长表格Selenium截图需要高精度用于存档或OCRPython 截图库方案一影刀内置截图指令最简单影刀的浏览器自动化里有两个截图指令截图指令截取当前浏览器可视区域。操作步骤打开目标网页等待页面加载完成使用截图指令 → 选择保存路径拼多多店群自动化上架方案就得到了当前屏幕能看到的区域局限只能截一屏。如果页面有三屏高只截到第一屏。元素截图指令截取指定元素的区域。适用场景只想要商品主图、订单表格、图表区域等特定元素的截图。方案二浏览器开发者工具全页截图零编码在Chrome中这是最无损的长截图方案按F12打开开发者工具按 CtrlShiftPWindows或 CmdShiftPMac输入 “screenshot” → 选择“Capture full size screenshot”Chrome会自动滚动并拼成一张完整的页面截图保存到下载目录在影刀中自动化这个操作影刀可以直接用发送快捷键模拟开发者工具的操作1. 打开目标网页 2. 发送快捷键F12打开开发者工具 3. 等待2秒 4. 发送快捷键CtrlShiftP 5. 等待1秒 6. 模拟输入Capture full size screenshot 7. 发送按键Enter 8. 等待3秒 9. 从浏览器下载目录移动截图到目标位置注意这个方法依赖Chrome界面网速慢或者电脑卡的时候等待时间可能需要加长。方案三Python Selenium实现滚动截图精确控制如果你需要对截图过程有精确控制或者需要截取比浏览器全页截图更长的内容用Python代码。先安装所需库在影刀中执行Python代码块需要先确保环境中有以下库# 在影刀的Python环境中安装如果还没装# pip install selenium Pillow完整代码分段截图拼接fromseleniumimportwebdriverfromselenium.webdriver.common.byimportByfromPILimportImageimporttimeimportosdefcapture_full_page_screenshot(url,output_path,scroll_step800): 分段截取网页并拼接成长图 url: 目标网页地址 output_path: 输出图片路径 scroll_step: 每次滚动的像素高度默认800 driverwebdriver.Chrome()driver.get(url)time.sleep(3)# 等待页面加载# 获取页面总高度total_heightdriver.execute_script(return document.body.scrollHeight)viewport_heightdriver.execute_script(return window.innerHeight)screenshots[]current_position0whilecurrent_positiontotal_height:# 滚动到指定位置driver.execute_script(fwindow.scrollTo(0,{current_position}))time.sleep(0.5)# 等待渲染# 截图screenshot_pathfscreenshot_part_{current_position}.pngdriver.save_screenshot(screenshot_path)screenshots.append(screenshot_path)current_positionscroll_step# 拼接所有截图images[Image.open(p)forpinscreenshots]# 计算总宽度和总高度处理重叠部分total_widthmax(img.widthforimginimages)total_height_canvassum(img.heightforimginimages)-(len(images)-1)*(scroll_step-viewport_height)resultImage.new(RGB,(total_width,int(total_height_canvas)))y_offset0fori,imginenumerate(images):ifilen(images)-1:# 最后一张只取从重叠点到底部的部分overlapscroll_step-(viewport_heightifi0else0)crop_topmax(0,img.height-(total_height-current_positionscroll_step))result.paste(img.crop((0,crop_top,img.width,img.height)),(0,y_offset))else:result.paste(img,(0,y_offset))y_offsetscroll_step result.save(output_path)# 清理临时文件forpinscreenshots:os.remove(p)driver.quit()returnoutput_path# 调用示例capture_full_page_screenshot(https://example.com/product/12345,rD:\screenshots\product_full.png)这段代码的核心逻辑把页面从上到下分成多段每段截一张图然后像拼拼图一样把截到的图片拼接起来。注意事项滚动步长step太大 → 可能漏掉内容step太小 → 截图太多、拼接慢。一般设置为浏览器窗口高度的80%左右。异步加载有些网页内容是随着滚动动态加载的比如微博、抖音的无限滚动。这种页面需要先滚动到底部触发所有内容加载再分段截图。固定元素很多网页顶部有固定导航栏、底部有固定客服按钮。分段截图时这些元素会出现在每一张截图中导致拼接后导航栏和客服按钮出现多次。可以通过CSS隐藏它们driver.execute_script( var fixed document.querySelectorAll(.fixed-header, .fixed-footer, .sticky, .float-bar); fixed.forEach(function(el) { el.style.display none; }); )方案四影刀调用浏览器自带的截图APIChrome DevTools ProtocolCDP提供了Page.captureScreenshot方法可以截取完整页面。在影刀中如果你用的是影刀内置浏览器可以尝试在流程中加入JavaScript代码块TEMU店群如何管理运营// 这个方案依赖浏览器是否支持CDP测试环境可能不可用// 如果不行就用方案三这个方法比较不稳定不同版本的影刀浏览器支持情况不同推荐优先使用方案三。截图后的常见处理添加水印截图存证时通常需要加水印fromPILimportImage,ImageDraw,ImageFontdefadd_watermark(image_path,text,output_path):imgImage.open(image_path)drawImageDraw.Draw(img)# 在右下角添加半透明文字fontImageFont.truetype(simhei.ttf,30)text_widthdraw.textlength(text,fontfont)ximg.width-text_width-50yimg.height-80draw.text((x,y),text,fontfont,fill(255,255,255,128))img.save(output_path)压缩图片长截图文件往往很大几MB甚至十几MB发送前可以压缩img.save(output_path,quality60,optimizeTrue)写在最后网页截图看似简单实际上场景差异很大。记住三个选型原则简单快照→ 影刀内置截图指令就够了长页面→ Chrome全页截图或Selenium分段拼接需要处理、加水印→ Python PIL方案大部分RPA自动化场景里用的是第二个方案Chrome全页截图。它零编码、质量高、速度快。只有在需要精确定制比如去掉导航栏、加水印时才上Python方案。内容标签影刀RPA · 网页截图 · 长图拼接 · Selenium · 页面快照 · 数据存证作者林焱系列说明本文是「影刀RPA新手到高手」系列教程之一面向需要制作页面快照的运营和开发者。