滑动验证码

案例展示

这种只要用鼠标点击并移动指定距离就可以完成验证（x轴）

实现

# -*- coding: utf-8 -*-
import time

from selenium import webdriver
from selenium.webdriver import ChromeOptions, ActionChains

# 添加参数
options = ChromeOptions()
# options.add_argument('--headless')
# options.add_argument('--no-sanbox')

# 创建WebDriver对象
browser = webdriver.Chrome(options=options)
browser.get('目标网址')
browser.maximize_window()
time.sleep(1)

# 事件参数对象
actionChains = ActionChains(browser)

# 捕捉滑块元素
slide_btn = browser.find_element_by_id('sliderblock')
# 观察网站滑块移动的长度和位置
actionChains.drag_and_drop_by_offset(slide_btn, 338, 0).perform()
time.sleep(5)
print(browser.page_source)

# 关闭
browser.close()

滑块拼图验证码

案例展示

这种是点击滑块会弹出白色方块和暗灰色方块，只要将白色方块移动覆盖暗灰色方块便能通过，白色方块是一张图片，暗灰色方块是通过style样式设计的，我们可以根据它们之间style的left计算差异值从而得到滑块滑动距离

实现

# -*- coding: utf-8 -*-
import re
import time

from selenium import webdriver
from selenium.webdriver import ChromeOptions, ActionChains

# 添加参数
options = ChromeOptions()
# options.add_argument('--headless')
# options.add_argument('--no-sanbox')

# 创建WebDriver对象
browser = webdriver.Chrome(options=options)
browser.get('目标网址')
browser.maximize_window()
time.sleep(2)

# 事件参数对象
actionChains = ActionChains(browser)
# 点击滑块按钮触发位移内容
click_btn = browser.find_element_by_id('jigsawCircle')
click_btn.click()
time.sleep(1)

# 通过计算方块和背景凹陷之前的距离移动滑块
white_btn_style = browser.find_element_by_id('missblock').get_attribute('style')
grey_img_style = browser.find_element_by_id('targetblock').get_attribute('style')
white_offset_px = re.search(r'left: (.*?)px;', white_btn_style).group(1)
grey_offset_px = re.search(r'left: (.*?)px;', grey_img_style).group(1)
slider_px = float(grey_offset_px.strip()) - float(white_offset_px.strip())

# # 观察网站滑块移动的长度和位置
actionChains.drag_and_drop_by_offset(click_btn, slider_px, 0).perform()
time.sleep(2)
print(browser.page_source)

# 关闭
browser.close()

滑块拼图验证码（Canvas）

案例展示

这种也是只要将白色方块移动覆盖暗灰色方块便能通过，但是暗灰色方块是通过canvas绘制的，我们无法通过样式知道它与白色方块的距离。可以先拿到绘制前后两张背景图，然后使用PIL对比两张图片的差异，得到差异的坐标。

实现

# -*- coding: utf-8 -*-
import time

from PIL import Image, ImageChops
from selenium import webdriver
from selenium.webdriver import ChromeOptions, ActionChains

# 添加参数
options = ChromeOptions()
# options.add_argument('--headless')
# options.add_argument('--no-sanbox')

# 创建WebDriver对象
browser = webdriver.Chrome(options=options)
browser.get('http://www.porters.vip/captcha/jigsawCanvas.html')
browser.maximize_window()
time.sleep(2)

# 定位滑块
slide_btn = browser.find_element_by_id('jigsawCircle')
# 定位背景图
pre_img = browser.find_element_by_id('imagebox')
# 截取背景图
pre_img.screenshot('before.png')
# 事件对象
actionChains = ActionChains(browser)
# 点击滑块
actionChains.click_and_hold(slide_btn).perform()
time.sleep(1)
# 使用js隐藏方块
script = """
    var missblock = document.getElementById('missblock');
    missblock.style['visibility'] = 'hidden';
"""
browser.execute_script(script)
time.sleep(1)
# 再次截图
pre_img.screenshot('after.png')

# 使用PIL创建Image
before_img = Image.open('before.png').convert('RGB')
after_img = Image.open('after.png').convert('RGB')
# 使用ImageChops对比差异
different_place = ImageChops.difference(before_img, after_img)
diff_position = different_place.getbbox()

# 使用js显示方块
script = """
    var missblock = document.getElementById('missblock');
    missblock.style['visibility'] = '';
"""
browser.execute_script(script)
time.sleep(1)

# 观察网站滑块移动的长度和位置
actionChains.drag_and_drop_by_offset(slide_btn, diff_position[0] - 10, 0).perform()
time.sleep(2)

# 关闭
browser.close()

使用ImageChops.difference对比差异是发现getbbox()返回的是None，这里需要在打开图片是采用RGB的方式：Image.open('after.png').convert('RGB')