影刀RPA 网页截图长图拼接：完整页面截图方案

影刀RPA 网页截图长图拼接完整页面截图方案作者林焱有时候需要保存整个网页的完整截图包括滚动才能看到的部分。影刀自带的截图指令只能截当前可视区域。这篇讲怎么截取完整页面长图。方案一浏览器全页截图Playwright最优fromplaywright.sync_apiimportsync_playwrightwithsync_playwright()asp:browserp.chromium.launch()pagebrowser.new_page()page.goto(https://example.com/long-page)# 一行代码全页截图page.screenshot(pathfullpage.png,full_pageTrue)browser.close()Playwright的full_pageTrue会自动计算页面总高度滚动拼接输出一张完整的长图。这是最简单且效果最好的方案。方案二Selenium滚动拼接fromseleniumimportwebdriverfromPILimportImageimportioimporttime driverwebdriver.Chrome()deffullpage_screenshot(driver,output_path):# 获取页面总高度total_heightdriver.execute_script(return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight))viewport_heightdriver.execute_script(return window.innerHeight)screenshots[]offset0whileoffsettotal_height:driver.execute_script(fwindow.scrollTo(0,{offset}))time.sleep(0.3)# 等页面渲染# 截图当前视口[video(video-mQsW1mzI-1784736800952)(type-csdn)(url-https://live.csdn.net/v/embed/525010)(image-https://v-blog.csdnimg.cn/asset/f4faa587144cb7070f19e8b36813806b/cover/Cover0.jpg)(title-店群矩阵自动化突破运营极限)]screenshotdriver.get_screenshot_as_png()screenshots.append(Image.open(io.BytesIO(screenshot)))offsetviewport_height# 拼接图片total_widthmax(img.widthforimginscreenshots)combinedImage.new(RGB,(total_width,total_height))y_offset0forimginscreenshots:combined.paste(img,(0,y_offset))y_offsetimg.height combined.save(output_path)print(f长图已保存到:{output_path})fullpage_screenshot(driver,full_page.png)driver.quit()方案三浏览器开发者工具手动方式不想写代码的话可以这样做F12打开开发者工具CtrlShiftP 打开命令面板输入 “Capture full size screenshot”自动下载完整页面截图但这个方案不能自动化——影刀流程中还得用Python代码。局部元素截图有时候你只需要截取页面中的某个区域比如一个表格、一张图表fromplaywright.sync_apiimportsync_playwrightwithsync_playwright()asp:browserp.chromium.launch()pagebrowser.new_page()page.goto(https://example.com)# 截取特定元素elementpage.locator(#data-table)element.screenshot(pathtable_screenshot.png)browser.close()长图拼接已有图片拼接如果你已经有一组按顺序截好的图想拼成一张长图fromPILimportImageimportglobdefstitch_images(image_folder,output_path):imagessorted(glob.glob(f{image_folder}/*.png))imgs[Image.open(p)forpinimages]# 统一宽度用最宽的max_widthmax(img.widthforimginimgs)total_heightsum(img.heightforimginimgs)combinedImage.new(RGB,(max_width,total_height))y_offset0forimginimgs:combined.paste(img,(0,y_offset))y_offsetimg.height combined.save(output_path)stitch_images(screenshots/,long_screenshot.png)踩坑实录坑1滚动拼接时有重叠或缝隙页面在滚动时如果有固定导航栏sticky header会导致截图重叠。解决方法先隐藏固定元素再截图page.evaluate( document.querySelectorAll(header, .fixed-nav).forEach(el { el.style.display none; }); )坑2懒加载图片截图为空白很多页面的图片是滚动到才加载的lazy load快速滚动截屏时图片还没加载。滚动后等待图片加载完成temu店群自动化报活动案例page.evaluate(window.scrollTo(0, {offset}))page.wait_for_timeout(500)# 等500毫秒让图片加载page.wait_for_load_state(networkidle)# 等所有网络请求完成坑3长图文件太大一个完整页面截图可能有几MB甚至几十MB。如果需要发送或存档压缩一下fromPILimportImage imgImage.open(fullpage.png)img.save(fullpage_compressed.jpg,quality85,optimizeTrue)# 或者缩小分辨率img.thumbnail((1920,99999))# 宽度不超过1920img.save(fullpage_resized.png,optimizeTrue)坑4动态页面高度不断变化有些页面有无限滚动自动加载更多内容scrollHeight一直在变。这种页面需要特殊处理——先滚到底再截。last_height0whileTrue:driver.execute_script(window.scrollTo(0, document.body.scrollHeight))time.sleep(1)new_heightdriver.execute_script(return document.body.scrollHeight)ifnew_heightlast_height:breaklast_heightnew_height写在最后全页截图在归档、留证、生成报告场景中很有用。Playwright是首选方案一行代码搞定Selenium适合已经有Selenium环境的项目。如果只是偶尔手动用Chrome自带的全页截图功能最方便。