如何使用webdriverio定位iframe并点击google reCAPTCHA

Google reCAPTCHA加载的iframe属于跨域资源，父页面直接访问iframe内部DOM会被浏览器同源策略拦截，这是绝大多数操作失败的核心原因。不同场景的解决方案如下：

自动化测试/爬虫场景（Selenium/Playwright/Puppeteer） #

• 第一步需要准确定位到reCAPTCHA专属iframe，可通过title属性为reCAPTCHA、src属性包含recaptcha关键词两个特征筛选，以Selenium Python代码为例：

  # 定位reCAPTCHA iframe
  recaptcha_iframe = driver.find_element(By.CSS_SELECTOR, 'iframe[title="reCAPTCHA"]')
  # 切换驱动上下文到iframe内
  driver.switch_to.frame(recaptcha_iframe)
  

• 上下文切换完成后，定位勾选框元素执行点击操作即可：

  driver.find_element(By.CLASS_NAME, 'recaptcha-checkbox-border').click()
  

• 所有iframe内操作完成后，可执行以下代码回到父页面上下文：

  driver.switch_to.default_content()
  

自有站点内嵌reCAPTCHA场景 #

• 不要尝试在父页面JS中直接操作iframe内部元素，同源策略会直接拦截该类操作
• 如需自定义触发校验，直接调用官方提供的grecaptcha.execute()接口即可，无需触碰iframe内部DOM

注意：自动化操作时建议在切换iframe上下文后加入100~300ms的等待逻辑，避免因iframe内部资源未加载完成导致的元素定位失败。

内容的提问来源于stack exchange，提问作者Prakash Patil