Cách lấy dữ liệu từ Iframes với Playwright và Scrapeless

python -m pip install "playwright==1.59.0"

import os
from urllib.parse import urlencode
from playwright.sync_api import sync_playwright

params = urlencode({
    "token": os.environ["SCRAPELESS_API_KEY"],
    "sessionTTL": 120,
    "proxyCountry": "US",
})
cdp_url = f"wss://browser.scrapeless.com/api/v2/browser?{params}"

with sync_playwright() as p:
    browser = p.chromium.connect_over_cdp(cdp_url)
    page = browser.contexts[0].pages[0]
    # Tiếp tục với các bước khung bên dưới.
    browser.close()

TARGET_URL = "https://www.selenium.dev/selenium/web/iframes.html"

page.goto(TARGET_URL, wait_until="domcontentloaded")
page.wait_for_selector("#iframe1")
page.wait_for_timeout(500)
print("tiêu đề cha:", page.title())
print("email của cha khớp:", page.locator("#email").count())

tiêu đề cha: Trang này có iframes
email của cha khớp: 0

print("số lượng khung:", len(page.frames))
for index, frame in enumerate(page.frames):
    print(index, repr(frame.name), frame.url, frame.title())

số lượng khung: 2
0 '' https://www.selenium.dev/selenium/web/iframes.html Trang này có iframes
1 'iframe1-name' https://www.selenium.dev/selenium/web/formPage.html Chúng tôi rời khỏi đây

named_frame = page.frame(name="iframe1-name")
url_frame = next(
    frame for frame in page.frames
    if frame.url.endswith("/formPage.html")
)

assert named_frame is url_frame
print("khung đã chọn:", url_frame.name)
print("tiêu đề đã chọn:", url_frame.title())

email = url_frame.locator("#email")
selected = url_frame.locator("#multi option:checked").evaluate_all(
    "options => options.map(option => option.value)"
)

record = {
    "frame_name": url_frame.name,
    "frame_url": url_frame.url,
    "frame_title": url_frame.title(),
    "email_inputs": email.count(),
    "selected_values": selected,
}

print("số lượng email đầu vào:", record["email_inputs"])
print("giá trị đã chọn:", record["selected_values"])

số lượng email đầu vào: 1
giá trị đã chọn: ['trứng', 'xúc xích']

frame_ui = page.frame_locator("#iframe1")
print("email qua FrameLocator:", frame_ui.locator("#email").count())

from playwright.sync_api import sync_playwright

TARGET_URL = "https://www.selenium.dev/selenium/web/iframes.html"

with sync_playwright() as p:
    browser = p.chromium.launch(
        executable_path="/usr/bin/google-chrome",
        headless=True,
    )
    page = browser.new_page()
    page.goto(TARGET_URL, wait_until="domcontentloaded")
    page.wait_for_selector("#iframe1")
    page.wait_for_timeout(500)

    child = next(
        frame for frame in page.frames
        if frame.url.endswith("/formPage.html")
    )
    selected = child.locator("#multi option:checked").evaluate_all(
        "options => options.map(option => option.value)"
    )
    frame_locator_count = page.frame_locator("#iframe1").locator("#email").count()

    assert page.locator("#email").count() == 0
    assert child.name == "iframe1-name"
    assert child.locator("#email").count() == 1
    assert selected == ["trứng", "xúc xích"]
    assert frame_locator_count == 1

    print("tiêu đề cha:", page.title())
    print("số lượng email cha khớp:", page.locator("#email").count())
    print("số lượng khung:", len(page.frames))
    print("tên con:", child.name)
    print("URL con:", child.url)
    print("tiêu đề con:", child.title())
    print("số lượng email con khớp:", child.locator("#email").count())
    print("giá trị đã chọn:", selected)
    print("số lượng khớp email FrameLocator:", frame_locator_count)
    browser.close()

{
  "parent_email_matches": 0,
  "frame_count": 2,
  "frame_name": "iframe1-name",
  "frame_url": "https://www.selenium.dev/selenium/web/formPage.html",
  "frame_title": "Chúng tôi rời khỏi đây",
  "child_email_matches": 1,

Kết quả đưa ra bốn sự thật: tài liệu cha không thể nhìn thấy trường email, đứa trẻ dự định có thể nhận diện bằng tên và URL, bộ định vị trẻ tìm thấy một đầu vào khớp, và các giá trị biểu mẫu được chọn đến từ bên trong khung đó. Giữ tên khung và URL với mỗi bản ghi được trích xuất khi một trang chứa nhiều tài liệu nhúng.

## Khung Iframe Chéo Nguồn và Chính Sách Giống Nguồn

JavaScript của trình duyệt như `document.querySelector("iframe").contentDocument` có thể bị chặn khi nguồn gốc của cha và trẻ khác nhau. Playwright giao tiếp với giao thức tự động hóa trình duyệt và tiết lộ trẻ như một Khung, vì vậy nó có thể xác định vị trí và tương tác với các yếu tố trong tài liệu chéo nguồn.

Điều đó không loại bỏ mọi ranh giới. Các thuộc tính hộp cát có thể hạn chế các tập lệnh, điều hướng có thể thay thế một khung trong khi bạn đang đọc nó, và các tiện ích mở rộng của trình duyệt hoặc trình xem PDF có thể không tiết lộ một tài liệu HTML thông thường. Kiểm tra cấu trúc khung thực tế trước khi viết hợp đồng trích xuất.

## Khung Động và Khung Lồng

### Chờ đợi đính kèm và điều hướng

Một phần tử iframe có thể xuất hiện trước khi đứa trẻ của nó đạt URL cuối cùng. Chờ một bộ định vị trẻ hoặc kiểm tra các sự kiện điều hướng khung; đánh dấu sẵn sàng hữu ích là phần tử chứa dữ liệu, không chỉ là thẻ `<iframe>` cha.

### Mong đợi sự tách rời

Các ứng dụng trang đơn đôi khi loại bỏ và tái tạo các iframe. Một đối tượng Khung đã lưu có thể trở nên tách rời. Giải quyết lại khung từ tên, URL hoặc phần tử chủ sở hữu ổn định của nó sau khi chuyển giao giao diện thay vì giả định rằng đối tượng cũ vẫn tồn tại.

### Đi qua các khung lồng một cách có chủ đích

Đối với các ngữ cảnh lồng nhau, kiểm tra `frame.child_frames` hoặc chuỗi FrameLocators. Giữ đường dẫn cha-con trong nguồn xuất của đầu ra để hai tiện ích widget cùng tên không thể bị nhầm lẫn.

## Kết luận

Việc trích xuất từ iframe bắt đầu bằng cách chọn tài liệu phù hợp. Liệt kê cấu trúc khung, chọn trẻ bằng tên hoặc URL ổn định, chờ một phần tử bên trong nó, và giữ thông tin siêu dữ liệu khung với bản ghi được trích xuất. Sử dụng FrameLocator cho các hành động ngắn gọn và đối tượng Khung khi bạn cần danh tính, điều hướng hoặc kiểm soát khung lồng. Chuyển quy trình làm việc sang Scrapeless thay đổi cách tạo trình duyệt, không phải logic khung.

## Sẵn sàng Trích Xuất Dữ Liệu Từ Iframes?

Tham gia các nhà phát triển xây dựng quy trình trích xuất dựa trên trình duyệt trong cộng đồng Scrapeless: [Discord](https://discord.gg/VU2vtbq7Q2) · [Telegram](https://t.me/scrapeless).

[Bắt đầu với Scrapeless](https://app.scrapeless.com/passport/login/?utm_source=website&utm_medium=blog&utm_campaign=scrapingbrowser&utm_term=iframe-web-scraping-scraping-browser), xem lại [giá của Scrapeless](https://www.scrapeless.com/vi/pricing?utm_source=website&utm_medium=blog&utm_campaign=scrapingbrowser&utm_term=iframe-web-scraping-scraping-browser), và đọc [những gì CDP tiết lộ](https://www.scrapeless.com/vi/blog/what-is-chrome-devtools-protocol?utm_source=website&utm_medium=blog&utm_campaign=scrapingbrowser&utm_term=iframe-web-scraping-scraping-browser) trước khi chuyển quy trình khung tương tự sang trình duyệt được lưu trữ.

## Câu Hỏi Thường Gặp

**Q: Tại sao trang cha không thể tìm thấy một phần tử bên trong một iframe?**

Iframe sở hữu một tài liệu riêng biệt. Các bộ định vị trang cha tìm kiếm trong ngữ cảnh duyệt cha; hãy chọn Khung trẻ hoặc sử dụng FrameLocator trước.

**Q: Tôi có nên chọn một khung theo chỉ số mảng không?**

Không. Thứ tự khung thay đổi khi các trang thêm tiện ích hoặc quảng cáo. Thích sử dụng một tên ổn định, mẫu URL, hoặc phần tử iframe sở hữu và thất bại với các khớp mơ hồ.

**Q: Sự khác biệt giữa Khung và FrameLocator là gì?**

Một Khung tiết lộ danh tính tài liệu, URL, tên, vòng đời và các khung con. FrameLocator cung cấp các thao tác định vị ngắn gọn thông qua một phần tử iframe cụ thể.

**Q: Playwright có thể truy cập một iframe chéo nguồn không?**

Có, Playwright có thể tự động hóa các khung trẻ chéo nguồn thông qua giao thức trình duyệt ngay cả khi JavaScript trong trang không thể đọc `contentDocument` do chính sách giống nguồn.

**Q: Làm thế nào để tôi chờ một iframe được tải động?**

Chờ một bộ định vị chứa dữ liệu bên trong khung hoặc một URL khung cuối cùng đã biết. Sự hiện diện của phần tử iframe đơn thuần không chứng minh tài liệu trẻ của nó đã hoàn tất điều hướng.

**Q: Điều gì xảy ra nếu khung bị tách rời?**

Khung đã lưu không còn đại diện cho một tài liệu sống. Giải quyết lại khung thay thế từ chứng cứ ổn định sau khi chuyển trang.

**Q: Trích xuất iframe có hợp pháp không?**

Việc nhúng không thay đổi quyền dữ liệu hoặc điều khoản của mục tiêu. Xem lại chính sách của trang và nhà cung cấp nhúng, tôn trọng <a href="https://datatracker.ietf.org/doc/html/rfc9309" rel="nofollow"><strong>chỉ thị robot</strong></a> khi có thể, giữ khối lượng trong giới hạn, và tìm kiếm tư vấn pháp lý cho việc thu thập nhạy cảm hoặc thương mại.