AI Agents · Lekcja

Obsługa paginacji i treści dynamicznych

Podążanie za odnośnikami do następnej strony i używanie Playwright do stron renderowanych przez JavaScript.

Lekcja 3 z 413 kroki

Obsługa paginacji i treści dynamicznych to bezpłatna lekcja AI Agents na CoddyKit. To lekcja 3 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej AI Agents, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs AI Agents zawiera 4 lekcji w sumie.

Problem paginacji

Większość rzeczywistych witryn internetowych nie udostępnia wszystkich danych na jednej stronie. Wyniki są dzielone na wiele stron, aby zmniejszyć obciążenie. Agent musi wykrywać paginację i obsługiwać ją, aby zebrać kompletne zestawy danych.

Istnieją dwa typowe wzorce paginacji: odnośniki do następnej strony oraz wzorce adresów URL z numerem strony.

Wykrywanie odnośników do następnej strony

Wiele witryn ma przycisk „Next” lub odnośnik w postaci strzałki. Należy znaleźć znacznik kotwicy z rel='next' albo z tekstem takim jak „Next”, wyodrębnić jego href i śledzić go w pętli, dopóki taki odnośnik istnieje.

from bs4 import BeautifulSoup
import httpx

def scrape_all_pages(start_url: str) -> list:
    results = []
    url = start_url

    while url:
        response = httpx.get(url, timeout=10.0)
        soup = BeautifulSoup(response.text, 'html.parser')

        # Collect data from this page
        for item in soup.select('.result-item'):
            results.append(item.text.strip())

        # Find the next page link
        next_link = soup.find('a', rel='next') or soup.find('a', string='Next')
        url = next_link.get('href') if next_link else None

    return results

Wzorce adresów URL z numerem strony

Wiele interfejsów API i witryn korzysta z przewidywalnych wzorców adresów URL: /results?page=1, /results?page=2 itd. Agent może iterować po nich bezpośrednio, bez analizowania DOM w celu znalezienia odnośnika do następnej strony.

import httpx

def scrape_paginated_api(base_url: str, max_pages: int = 10) -> list:
    all_items = []

    for page in range(1, max_pages + 1):
        response = httpx.get(
            base_url,
            params={'page': page, 'per_page': 50},
            timeout=10.0
        )
        response.raise_for_status()
        data = response.json()

        items = data.get('results', [])
        if not items:
            break  # No more data

        all_items.extend(items)
        print(f'Page {page}: fetched {len(items)} items')

    return all_items

Paginacja oparta na kursorze

Nowoczesne interfejsy API (GitHub, Slack, Twitter) korzystają z paginacji opartej na kursorze. Każda odpowiedź zawiera token kursora wskazujący następną stronę. Należy przekazywać kursor w kolejnym żądaniu, dopóki nie przestanie występować lub nie będzie miał wartości null.

import httpx

def fetch_with_cursor(url: str, headers: dict) -> list:
    all_data = []
    cursor = None

    while True:
        params = {'cursor': cursor} if cursor else {}
        response = httpx.get(url, headers=headers, params=params, timeout=10.0)
        response.raise_for_status()
        data = response.json()

        all_data.extend(data.get('items', []))

        cursor = data.get('next_cursor')  # None when done
        if not cursor:
            break

    return all_data

Zawartość statyczna a dynamiczna

Niektóre strony wczytują zawartość za pomocą JavaScriptu po dostarczeniu początkowego kodu HTML. Zwykły klient HTTP otrzymuje tylko pusty szkielet — właściwe dane są wstrzykiwane przez JS w przeglądarce.

W przypadku takich stron narzędzia takie jak Playwright uruchamiają rzeczywisty silnik przeglądarki i czekają na wykonanie JavaScriptu przed wyodrębnieniem zawartości.

Instalowanie i importowanie Playwright

Playwright należy zainstalować za pomocą pip install playwright, a następnie uruchomić playwright install chromium, aby pobrać przeglądarkę. W asynchronicznych przepływach pracy agentów należy używać async_playwright().

# Installation (run in terminal):
# pip install playwright
# playwright install chromium

from playwright.async_api import async_playwright
import asyncio

async def fetch_dynamic(url: str) -> str:
    async with async_playwright() as p:
        browser = await p.chromium.launch(headless=True)
        page = await browser.new_page()
        await page.goto(url)
        html = await page.content()  # Full rendered HTML
        await browser.close()
    return html

# html = asyncio.run(fetch_dynamic('https://example.com'))

Oczekiwanie na wczytanie dynamicznej zawartości

Strony korzystające z JavaScriptu często wczytują dane asynchronicznie. Należy skonfigurować Playwright tak, aby czekał na pojawienie się określonego elementu przed wyodrębnieniem zawartości. Dzięki temu potrzebne dane będą rzeczywiście obecne w DOM.

from playwright.async_api import async_playwright

async def scrape_dynamic_table(url: str) -> list:
    async with async_playwright() as p:
        browser = await p.chromium.launch(headless=True)
        page = await browser.new_page()
        await page.goto(url)

        # Wait for the table to appear in the DOM
        await page.wait_for_selector('table.results', timeout=10000)

        html = await page.content()
        await browser.close()

    from bs4 import BeautifulSoup
    soup = BeautifulSoup(html, 'html.parser')
    return [td.text for td in soup.select('table.results td')]

Klikanie i interakcja ze stronami

Playwright może symulować interakcje użytkownika: kliknięcia, wypełnianie formularzy, przewijanie i wprowadzanie danych z klawiatury. Dzięki temu agent może przechodzić przez procesy logowania, listy rozwijane lub strony z nieskończonym przewijaniem.

from playwright.async_api import async_playwright

async def click_load_more(url: str) -> str:
    async with async_playwright() as p:
        browser = await p.chromium.launch(headless=True)
        page = await browser.new_page()
        await page.goto(url)

        # Click the 'Load More' button
        load_more = page.locator('button:text("Load More")')
        if await load_more.count() > 0:
            await load_more.click()
            await page.wait_for_timeout(2000)  # wait 2s for content

        html = await page.content()
        await browser.close()
    return html

Obsługa nieskończonego przewijania

Niektóre witryny wczytują więcej zawartości podczas przewijania w dół. Playwright może symulować przewijanie, aby wyzwalać te operacje. Należy wielokrotnie przewijać stronę i za każdym razem sprawdzać, czy pojawiła się nowa zawartość.

from playwright.async_api import async_playwright

async def scrape_infinite_scroll(url: str, scroll_count: int = 5) -> str:
    async with async_playwright() as p:
        browser = await p.chromium.launch(headless=True)
        page = await browser.new_page()
        await page.goto(url)

        for _ in range(scroll_count):
            await page.evaluate('window.scrollTo(0, document.body.scrollHeight)')
            await page.wait_for_timeout(1500)  # wait for new content

        html = await page.content()
        await browser.close()
    return html

Łączenie Playwright z BeautifulSoup

Po wyrenderowaniu strony przez Playwright i zwróceniu pełnego kodu HTML należy przekazać go do BeautifulSoup, aby łatwo wyodrębnić dane. Takie połączenie wykorzystuje zalety obu bibliotek.

from playwright.async_api import async_playwright
from bs4 import BeautifulSoup

async def extract_js_rendered_data(url: str) -> list:
    async with async_playwright() as p:
        browser = await p.chromium.launch(headless=True)
        page = await browser.new_page()
        await page.goto(url)
        await page.wait_for_selector('.product-card')
        html = await page.content()
        await browser.close()

    soup = BeautifulSoup(html, 'html.parser')
    products = []
    for card in soup.select('.product-card'):
        products.append({
            'name': card.select_one('.name').text.strip(),
            'price': card.select_one('.price').text.strip()
        })
    return products

Wybór właściwego narzędzia

Nie każda strona wymaga użycia Playwright. Należy stosować najprostsze podejście, które działa:

  • Statyczny HTML: httpx + BeautifulSoup (szybko, bez narzutu przeglądarki)
  • Interfejs JSON API z paginacją: httpx z parametrami strony lub kursora
  • Zawartość renderowana przez JS: asynchroniczny Playwright (wolniej, ale większe możliwości)

Należy zawsze rozpocząć od podejścia statycznego i sięgać po Playwright tylko wtedy, gdy jest to konieczne.

Sprawdzenie wiedzy: paginacja i dynamiczna zawartość

Proszę sprawdzić swoją wiedzę na temat obsługi paginacji i dynamicznej zawartości.

Podsumowanie: paginacja i dynamiczna zawartość

Państwa agenci potrafią teraz obsługiwać pełne spektrum zawartości internetowej:

  • Śledzić odnośniki do następnej strony lub iterować po parametrach strony w adresie URL
  • Używać tokenów kursora do paginacji w nowoczesnych interfejsach API
  • Używać async_playwright() w przypadku stron renderowanych przez JavaScript
  • Czekać na elementy za pomocą page.wait_for_selector()
  • Łączyć Playwright z BeautifulSoup, aby łatwo wyodrębniać dane

Należy zawsze rozpocząć od najprostszego podejścia i sięgać po Playwright dopiero wtedy, gdy podejście statyczne okaże się niewystarczające.

Bezpłatny start

Ucz się AI Agents dzięki korepetycjom AI — za darmo

Pisz i uruchamiaj kod w przeglądarce, otrzymuj natychmiastową pomoc od korepetytora AI dostępnego 24/7 i kontynuuj naukę w sieci lub w aplikacji.

Kursy
60
Lekcje
239

Często zadawane pytania

Czy lekcja „Obsługa paginacji i treści dynamicznych” jest bezpłatna?

Tak — pełny tekst „Obsługa paginacji i treści dynamicznych” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu AI Agents, przejdź na CoddyKit PRO. Kurs AI Agents zawiera 4 lekcji w sumie.

Co nauczysz się w „Obsługa paginacji i treści dynamicznych”?

Podążanie za odnośnikami do następnej strony i używanie Playwright do stron renderowanych przez JavaScript. Ćwiczysz AI Agents z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć AI Agents?

Nie wymagamy żadnego doświadczenia. AI Agents w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 3 z 4.

Ile czasu zajmuje lekcja „Obsługa paginacji i treści dynamicznych”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji AI Agents?

Tak. Każda lekcja AI Agents zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

  1. Klienty HTTP dla agentów: httpx i requests
  2. Parsowanie HTML za pomocą BeautifulSoup
  3. Obsługa paginacji i treści dynamicznych
  4. Odpowiedzialne praktyki web scrapingu
← Powrót do AI Agents