Trying to fetch base64 captcha images using Python Selenium has been a challenge.
The issue I'm encountering is that I can only access the HTML right before the images are loaded.
Here are the steps I've taken:
# importing necessary packages
from selenium.webdriver import EdgeOptions
from selenium import webdriver
from selenium.webdriver.chrome.service import Service
from webdriver_manager.microsoft import EdgeChromiumDriverManager
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC
options = EdgeOptions()
options.add_argument("--headless")
options.add_argument('disable-gpu')
driver = webdriver.Edge(service=Service(EdgeChromiumDriverManager().install()), options=options)
# accessing the website
driver.get("https://boards.4channel.org/o/")
# opening a post
driver.execute_script("document.getElementsByClassName('mobilePostFormToggle mobile hidden button')[0].click()")
# clicking on this ID
driver.execute_script("document.getElementById('t-load').click()")
# Getting the initial html - before javascript
html1 = driver.page_source
# Retrieving the html after javascript execution
html2 = driver.execute_script("return document.documentElement.innerHTML;")
# Checking for base64 images
'Loading' in html1 # True
'Loading' in html2 # True
# Further verification for base64 images
'data:image/png;base64' in html1 # False
'data:image/png;base64' in html2 # False
The relevant HTML object seems to be:
<button id="t-load" type="button" data-board="o" data-tid="0" style="font-size: 11px; padding: 0px; width: 90px; box-sizing: border-box; margin: 0px 6px 0px 0px; vertical-align: middle; height: 18px;">Get Captcha</button>