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.
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 resultsWzorce 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_itemsPaginacja 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_dataZawartość 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 htmlObsł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 productsWybó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.
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
- Klienty HTTP dla agentów: httpx i requests
- Parsowanie HTML za pomocą BeautifulSoup
- Obsługa paginacji i treści dynamicznych
- Odpowiedzialne praktyki web scrapingu