selenium利用js获取前端canvas画布标签的图片内容

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_39726347/article/details/87632561

————————————————
非小白直接阅读canvas文档
小白继续往下看

问题需求:

获取极验三代滑动验证的图片
查看官网示例:https://www.geetest.com/Sensebot/

极验三代滑动验证的图片

极验三代滑动验证使用canvas画布标签,普通方法取不到图,阅读本文第一行文档,得到解决思路:
使用selenium执行js文件,得到base64编码的图片信息,解码成bytes类型后保存为本地图片,下面直接看源码:

from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains
import time
import random
import base64

driver = webdriver.Chrome()
driver.get('http://127.0.0.1:8000/')  #打开本地部署的极验滑动验证

def click(block):  # 自定义点击函数,模拟人工点击
    action = ActionChains(driver)
    action.click_and_hold(block).perform()
    time.sleep(random.randint(1,10)/10)
    action.release(block).perform()
btn = driver.find_element_by_class_name('geetest_wait')  #到点击按钮
click(btn) # 验证第一步,点击按钮进行验证

#下面的js代码根据canvas文档说明而来
JS = 'return document.getElementsByClassName("geetest_canvas_bg geetest_absolute")[0].toDataURL("image/png");'
# 执行 JS 代码并拿到图片 base64 数据
im_info = driver.execute_script(JS)  #执行js文件得到带图片信息的图片数据
im_base64 = im_info.split(',')[1]  #拿到base64编码的图片信息
im_bytes = base64.b64decode(im_base64)  #转为bytes类型
with open('bg.png','wb') as f:  #保存图片到本地
    f.write(img_data)
# 完毕

图片Im_info数据截图:

图片Im_info数据截图