Selenium在AWS实例中无法正确渲染Streamlit网站子元素的问题

在AWS实例上运行Python 3.6.8与ChromeDriver 91.0.4472.19，使用以下Selenium代码访问https://moyocrawling.streamlit.app/时，出现以下问题：

• Selenium无法加载Streamlit的iframe内除ID为root的首个div之外的内容
• 页面截图显示全白
• 已尝试使用WebDriverWait等待元素加载，但iframe和root的readystate均显示为complete，问题仍未解决

询问该问题的可能原因。

运行代码 #

chrome_driver = "/usr/bin/chromedriver"
chrome_option = Options()

chrome_option.add_argument('--headless')
chrome_option.add_argument('--no-sandbox')
chrome_option.add_argument("--window-size=1920,1080")
chrome_option.add_argument("user-agent=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.3")

driver = webdriver.Chrome(executable_path=new_chrome_driver, options=chrome_option)

# Test with https://moyocrawling.streamlit.app/
# <button kind="secondary" data-testid="baseButton-secondary" class="st-emotion-cache-13ejsyy ef3psqc12"><div data-testid="stMarkdownContainer" class="st-emotion-cache-10fz3ls e1nzilvr5"><p>Just Moyos</p></div></button>
# <button kind="secondary" data-testid="baseButton-secondary" class="st-emotion-cache-13ejsyy ef3psqc12"><div data-testid="stMarkdownContainer" class="st-emotion-cache-10fz3ls e1nzilvr5"><p>Just Moyos</p></div></button>
# xpath: /html/body/div/div[1]/div[1]/div/div/div/section[1]/div[1]/div[2]/div/div/div/div/div[4]/div/button
try:
    driver.get("https://moyocrawling.streamlit.app/")
except:
    driver.quit()
    sys.exit()

def print_elements(elements, prefix=''):
    for element in elements:
        print(f"{prefix}Tag: {element.tag_name}, Class: {element.get_attribute('class')}")
        if element.tag_name == 'button':
            print(f"{prefix}Found a button: {element.get_attribute('outerHTML')}")
        elif element.tag_name == 'a':
            print(f"{prefix}Found a link: {element.get_attribute('outerHTML')}")
        elif element.tag_name == 'div':
            print(f"{prefix}Found a div: {element.get_attribute('outerHTML')}")
        elif element.tag_name == 'section':
            print(f"{prefix}Found a section: {element.get_attribute('outerHTML')}")
        children = element.find_elements(By.XPATH, ".//*")
        print_elements(children, prefix + '  ')

try:
    time.sleep(10)
    driver.execute_script("window.scrollTo(0, document.body.scrollHeight);")
    iframes = driver.find_elements(By.TAG_NAME, 'iframe')
    print(f"Found {len(iframes)} iframes.")
    # Optionally, print out attributes of each iframe to help identify the right one
    for index, iframe in enumerate(iframes):
        print(f"Iframe {index}: {iframe.get_attribute('src')}")
        driver.switch_to.frame(iframe)
        # Wait until the iframe's document is fully loaded
        WebDriverWait(driver, 60).until(lambda d: d.execute_script('return document.readyState') == 'complete')
        print("Iframe is ready")
        iframe_html = driver.page_source
        print(f"Iframe HTML: {iframe_html}")
        logs = driver.get_log('browser')
        for log in logs:
            print(log)
        
        WebDriverWait(driver, 60).until(EC.presence_of_element_located((By.CSS_SELECTOR, "#root:not(:empty)")))
        dynamic_content = driver.execute_script("return document.getElementById('root').innerHTML;")
        print(f"Dynamic content: {dynamic_content}")
        driver.switch_to.default_content()
        for entry in driver.get_log('browser'):
            print(entry)
except:
    print('iframe not found')
    driver.quit()
    sys.exit()

try:
    # time.sleep(10)
    # Just_moyos_button = driver.find_element_by_css_selector('.st-emotion-cache-13ejsyy.ef3psqc12')
    # Just_moyos_button = WebDriverWait(driver, 30).until(EC.element_to_be_clickable((By.CSS_SELECTOR, '.st-emotion-cache-13ejsyy.ef3psqc12')))
    #focus on iframe
    driver.switch_to.frame(iframes[0])
    time.sleep(10)
    print(driver.execute_script("return document.location.href;"))
    nested_elements = driver.execute_script("""return document.querySelector('#root').querySelectorAll('*').length;""")
    print(f"Nested elements count: {nested_elements}")
except:
    print('Just Moyos button not clickable')
    driver.quit()
    sys.exit()

可能的原因 #

• ChromeDriver与Chrome版本不兼容：你使用的ChromeDriver版本是91.0.4472.19，但AWS实例上的Chrome浏览器版本可能并非91.x系列。版本不匹配会导致浏览器渲染引擎与自动化工具之间的通信异常，直接影响Streamlit动态内容的加载。Streamlit依赖现代前端特性，旧版本或不匹配的浏览器环境会引发渲染失败。
• Headless模式的渲染缺陷：旧版本（如91）的Headless Chrome对React等现代前端框架的渲染支持不完善，容易出现动态内容无法注入、页面空白的情况。可以尝试添加--disable-gpu参数，或者升级ChromeDriver和Chrome到较新的稳定版本。
• 用户代理设置过于老旧：你配置的User-Agent对应Chrome 58版本，过于陈旧。Streamlit可能会针对旧浏览器返回简化或不兼容的页面资源，导致动态组件无法正常渲染。建议使用与当前ChromeDriver版本匹配的User-Agent字符串。
• AWS实例资源不足：如果AWS实例的CPU、内存配额较低，Chrome在渲染复杂的Streamlit页面时会出现资源瓶颈，导致动态内容加载超时或失败。可以检查实例的资源使用率，尝试升级实例规格。
• Streamlit的反爬检测：Streamlit应用可能通过检测自动化标识（如Selenium的特征）限制内容加载。可以尝试添加--disable-blink-features=AutomationControlled参数禁用自动化检测，或者模拟更多真实浏览器的行为（如随机化等待时间）。
• iframe加载时机判断不准确：虽然document.readyState显示为complete，但Streamlit的内容是通过JavaScript异步注入的，仅依赖readyState无法确保所有动态组件加载完成。建议修改等待逻辑，直接等待iframe内的目标元素（如"Just Moyos"按钮）出现，而不是仅等待root div非空。

内容的提问来源于stack exchange，提问作者Minsoo Cha