Python如何采集多个canvas组合而成的图片

问题描述

我们采集网站图片的时候，网站为了防止我们采集，图片的接口可能使用了加密模式，并且破解难度又很大。所以我们可能会使用selenium来采集图片。但是页面上的图片又使用了多个canvas画布叠加显示图片，每一个画布显示图片的一部分，来增加了我们采集图片的难度。

解决思路

我们采集所有canvas画布的图片（带透明通道），然后把这些图片保存为png图片，最后把这些图片叠加拼接再一起，形成一张图片。

解决方法

所以我使用了下面的代码来解决这个问题

from selenium import webdriver  
from selenium.webdriver.firefox.service import Service  
from selenium.webdriver.common.by import By  
from PIL import Image  
import io  
import base64  
import os  
  
# 设置geckodriver的路径  
service = Service('/path/to/geckodriver')  # 请替换为你的geckodriver的实际路径  
driver = webdriver.Firefox(service=service)  
  
# 打开网页  
driver.get('http://example.com/your-page-with-multiple-canvases')  # 请替换为包含多个canvas的页面URL  
  
# 等待所有canvas元素加载完成  
# 这里可以使用WebDriverWait配合expected_conditions来更精确地等待  
# ...  
  
# 查找所有的canvas元素  
canvas_elements = driver.find_elements(By.TAG_NAME, 'canvas')  
  
# 创建一个列表来保存所有的图片对象  
img_list = []  
  
# 遍历每个canvas元素并获取其内容  
for canvas in canvas_elements:  
    # 使用JavaScript获取canvas的内容  
    canvas_content = driver.execute_script("return arguments[0].toDataURL('image/png');", canvas)  
      
    # 将base64编码的图片内容解码为字节  
    img_bytes = base64.b64decode(canvas_content.split(',')[1])  
      
    # 将字节转换为图片对象  
    img = Image.open(io.BytesIO(img_bytes))  
      
    # 将图片对象添加到列表中  
    img_list.append(img)  
  
# 关闭浏览器  
driver.quit()  
  
# 确保保存图片的目录存在  
save_dir = '数字图片/'  
if not os.path.exists(save_dir):  
    os.makedirs(save_dir)  
  
# 创建一个新的图片对象，用于合并所有的图片  
merged_img = Image.new('RGBA', (max(img.size[0] for img in img_list), max(img.size[1] for img in img_list)))  
  
# 将每个图片合并到merged_img上，保持透明度  
y_offset = 0  
for img in img_list:  
    # 计算x偏移量以保持图片对齐（这里假设所有图片宽度相同）  
    x_offset = 0  
      
    # 将图片合并到merged_img上，保持透明度  
    merged_img.paste(img, (x_offset, y_offset), img)  
       
  
# 保存合并后的图片到文件  
merged_img.save(os.path.join(save_dir, 'merged_canvas_screenshot.png'))