Cào Website Động

Các trang web động tải nội dung bằng JavaScript sau khi tải trang ban đầu. Hướng dẫn này chỉ cách thu thập dữ liệu từ các trang web này bằng browser endpoint của FourA.

Vấn đề

Khi bạn gửi HTTP request tiêu chuẩn đến một trang web dùng nhiều JavaScript, bạn nhận được bộ khung HTML nhưng không có nội dung thực tế. Dữ liệu bạn cần (danh sách sản phẩm, giá cả, kết quả tìm kiếm) được tải bởi JavaScript sau khi trang hiển thị trong trình duyệt.

Điều này ngày càng phổ biến với các framework hiện đại như React, Vue, Angular và Next.js.

Giải pháp: Browser Request

Browser endpoint của FourA (POST /api/browser/) mở URL của bạn trong một instance trình duyệt Chrome thực hiện:

  1. Tải trang
  2. Thực thi tất cả JavaScript
  3. Đợi nội dung hiển thị
  4. Trả về HTML đã hiển thị đầy đủ

Bước 1: Xác định nội dung bạn cần

Trước khi tạo request, hãy truy cập trang đích trong trình duyệt của bạn và sử dụng DevTools (F12) để tìm một đoạn văn bản hoặc phần tử xác nhận nội dung đã tải. Ví dụ:

  • Tên sản phẩm xuất hiện sau khi JS hiển thị
  • Một class CSS như product-grid trong HTML đã hiển thị
  • Một chuỗi văn bản như "results" chỉ xuất hiện khi tải dữ liệu

Bước 2: Gửi Browser Request

curl -X POST https://eu.api.foura.ai/api/browser/ \
  -H "X-API-Key: YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "url": "https://example.com/products",
    "timeout_ms": 15000,
    "checkText": "product-grid"
  }'

Tùy chọn checkText yêu cầu FourA xác minh rằng chuỗi "product-grid" xuất hiện trong trang đã được kết xuất. Nếu nó không xuất hiện trước khi hết thời gian chờ, request sẽ thất bại, báo cho bạn biết nội dung đã không được tải.

Bước 3: Phân tích cú pháp HTML

response chứa HTML đã được kết xuất hoàn chỉnh trong trường body. Hãy phân tích cú pháp bằng thư viện bạn ưa thích:

Python (BeautifulSoup)

import requests
from bs4 import BeautifulSoup

resp = requests.post("https://eu.api.foura.ai/api/browser/", headers={
    "X-API-Key": "YOUR_API_KEY",
    "Content-Type": "application/json"
}, json={
    "url": "https://example.com/products",
    "timeout_ms": 15000,
    "checkText": "product-grid"
})

html = resp.json()["body"]
soup = BeautifulSoup(html, "html.parser")

for product in soup.select(".product-card"):
    name = product.select_one(".product-name").text.strip()
    price = product.select_one(".product-price").text.strip()
    print(f"{name}: {price}")

Node.js (cheerio)

import * as cheerio from 'cheerio';

const resp = await fetch('https://eu.api.foura.ai/api/browser/', {
  method: 'POST',
  headers: { 'X-API-Key': 'YOUR_API_KEY', 'Content-Type': 'application/json' },
  body: JSON.stringify({
    url: 'https://example.com/products',
    timeout_ms: 15000,
    checkText: 'product-grid'
  })
});

const { body: html } = await resp.json();
const $ = cheerio.load(html);

$('.product-card').each((i, el) => {
  console.log($(el).find('.product-name').text(), $(el).find('.product-price').text());
});

Khắc phục sự cố

Vẫn nhận được nội dung trống?

  • Xác minh trang thực sự sử dụng JavaScript rendering (kiểm tra bằng "View Source" so với DevTools)
  • Tăng timeout_ms: một số trang tải chậm
  • Kiểm tra xem trang có yêu cầu xác thực hoặc cookie không (sử dụng tham số cookies)

Nhận được trang CAPTCHA?

  • Đối với các request HTTP/đơn lẻ, hãy chuyển sang proxy endpoint (POST /api/proxy/) để tự động luân phiên IP.
  • Để định tuyến một browser request qua proxy, hãy truyền tham số proxy của browser endpoint. Proxy endpoint chỉ bọc các request HTTP/đơn lẻ, không phải browser request.

Tham số proxy nhận opaque proxy ID mà một response trước đó trả về, tuyệt đối không dùng địa chỉ proxy của riêng bạn. Trước tiên, hãy thực hiện một lệnh gọi POST /api/proxy/ (hoặc POST /api/auto/), đọc trường proxy mà nó trả về, sau đó ghim nó lại:

# Step 1: let FourA find a working exit. The response carries "proxy": "A1B2C3".
curl -X POST "https://eu.api.foura.ai/api/proxy/" \
  -H "X-API-Key: YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"maxTries": 5, "request": {"method": "GET", "url": "https://example.com/products"}}'

# Step 2: render through that same exit.
curl -X POST "https://eu.api.foura.ai/api/browser/" \
  -H "X-API-Key: YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"url": "https://example.com/products", "proxy": "A1B2C3", "timeout_ms": 20000}'

Việc gửi một địa chỉ thay vì một ID sẽ trả về 400 Invalid proxy format. Mô hình đầy đủ có trong Tái sử dụng một proxy qua nhiều request.

Các bước tiếp theo

Cập nhật: 12 tháng 8, 2026