Verkkosivujen kaavinta ja botit · Oppitunti

Tietojen poiminta JavaScriptistä

Oppikaa hakemaan JavaScriptin tuottamia tai lataamia tietoja, mukaan lukien AJAX-kutsujen ja yhden sivun sovellusten sisältö.

Oppitunti 3/411 vaihetta

Tietojen poiminta JavaScriptistä on ilmainen Verkkosivujen kaavinta ja botit-oppitunti CoddyKitissä. Tämä on oppitunti 3/4. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu Verkkosivujen kaavinta ja botit-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Verkkosivujen kaavinta ja botit-kurssilla on yhteensä 4 oppituntia.

Dynaaminen verkkosisältö selitettynä

Monet nykyaikaiset verkkosivustot eivät lataa kaikkea sisältöä kerralla. Sen sijaan ne käyttävät JavaScriptiä tietojen hakemiseen ja sivun päivittämiseen sen jälkeen, kun sivu on ensin latautunut. Tätä kutsutaan dynaamiseksi sisällöksi.

Perinteiset kaavintatyökalut, kuten Requests ja BeautifulSoup, näkevät vain alkuperäisen HTML-koodin. Ne eivät näe mitään, minkä JavaScript lataa myöhemmin.

JavaScriptin rooli lataamisessa

JavaScript voi ladata uusia tietoja useilla tavoilla:

  • AJAX-kutsut: Asynchronous JavaScript and XML. Selain pyytää tietoja palvelimelta taustalla lataamatta koko sivua uudelleen.
  • DOM-rakenteen muokkaus: JavaScript lisää, poistaa tai muokkaa suoraan sivun rakenteen elementtejä (Document Object Model).
  • Single-Page Applications (SPA:t): kokonaiset verkkosivustot, jotka on rakennettu lataamaan sisältöä ja siirtymään näkymästä toiseen dynaamisesti ilman koko sivun päivittämistä.

Tämä dynaaminen lataaminen tekee kaavinnasta monimutkaisempaa.

Milloin Requests ja BS4 eivät riitä

Kun käytätte Pythonin requests-kirjastoa, saatte palvelimen alun perin lähettämän raakamuotoisen HTML-koodin. Jos verkkosivusto lataa sen jälkeen lisää tietoja JavaScriptin avulla, kyseiset tiedot eivät sisälly vastaanottamaanne HTML-koodiin.

BeautifulSoup voi jäsentää vain sille annetun HTML-koodin. Se ei pysty suorittamaan JavaScriptiä lisäsisällön hakemiseksi tai odottamaan sen ilmestymistä.

Selenium dynaamiselle sisällölle

Tässä Seleniumista tulee välttämätön. Selenium ohjaa oikeaa verkkoselainta, kuten Chromea tai Firefoxia, ohjelmallisesti.

Kun Selenium avaa sivun, selain suorittaa kaiken JavaScriptin, mukaan lukien AJAX-kutsut ja DOM-rakenteen muokkaukset. Siksi Selenium näkee kokonaan renderöidyn sivun aivan kuten ihminenkin.

Elementtien ilmestymisen odottaminen

Koska sisältö latautuu dynaamisesti, se ei välttämättä ole heti käytettävissä, kun Selenium lataa sivun ensimmäisen kerran. Selenium on ohjattava odottamaan, kunnes tietty elementti tai ehto täyttyy, ennen tietojen poimimisen aloittamista.

Jos ette odota, komentosarja saattaa yrittää löytää elementin ennen kuin JavaScript on renderöinyt sen, mikä johtaa virheisiin tai puuttuviin tietoihin.

Eksplisiittisten odotusten käyttäminen

Seleniumin WebDriverWait yhdessä ExpectedConditions-moduulin (EC) kanssa mahdollistaa eksplisiittisten odotusten määrittämisen. Tämä käskee Seleniumia odottamaan enintään tietyn ajan, kunnes tietty ehto täyttyy.

Yleisiä ehtoja ovat elementin näkyväksi, napsautettavaksi tai DOM-rakenteessa olevaksi tulemisen odottaminen.

Kokeilkaa suorittaa tämä esimerkki:

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
import time

def main():
    driver = webdriver.Chrome()
    driver.get("https://www.selenium.dev/selenium/web/dynamic.html")

    # Click a button that will make an element appear after a delay
    driver.find_element(By.ID, "adder").click()

    # Wait up to 10 seconds for the new element to appear
    try:
        new_element = WebDriverWait(driver, 10).until(
            EC.presence_of_element_located((By.ID, "box0"))
        )
        print("New element found:", new_element.text)
    except Exception as e:
        print("Element not found within time limit:", e)

    driver.quit()

if __name__ == "__main__":
    main()

Renderöityjen tietojen poimiminen

Kun olette onnistuneesti odottaneet dynaamisen sisällön ilmestymistä, tietojen poimiminen tapahtuu samalla tavalla kuin staattisesta sisällöstä Seleniumia käyttämällä.

Voitte paikantaa elementit menetelmillä, kuten find_element(By.ID, "id_name"), find_element(By.CLASS_NAME, "class_name") tai find_element(By.CSS_SELECTOR, "css_selector"). Sen jälkeen voitte noutaa niiden tekstisisällön tai määritteet.

Koodi: dynaamisen tekstin hakeminen

Tässä esimerkissä odotetaan elementtiä ja poimitaan sitten sen teksti. Kuvitelkaa sivu, jolla "Loading..."-viesti muuttuu muutaman sekunnin kuluttua varsinaisiksi tiedoiksi.

Kokeilkaa suorittaa tämä esimerkki:

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
import time

def main():
    driver = webdriver.Chrome()
    # Using a simple test page that changes content
    driver.get("https://www.selenium.dev/selenium/web/dynamic.html")

    # Click button to reveal content
    driver.find_element(By.ID, "reveal").click()

    # Wait for the content to be visible
    try:
        # The 'revealed' div becomes visible
        revealed_div = WebDriverWait(driver, 10).until(
            EC.visibility_of_element_located((By.ID, "revealed"))
        )
        print("Revealed content:", revealed_div.text)
    except Exception as e:
        print("Revealed content not found:", e)

    driver.quit()

if __name__ == "__main__":
    main()

Single-Page Application -sovellusten kaavinta

Single-Page Application -sovellukset (SPA:t) ovat verkkosivustoja, jotka lataavat yhden HTML-sivun ja päivittävät sitten sisältöä dynaamisesti käyttäjän toimien mukaan. SPA-sovelluksessa siirtyminen näkymästä toiseen ei yleensä lataa koko sivua uudelleen.

Selenium käsittelee SPA-sovelluksia hyvin, koska se toimii kokonaisena selaimena. Olette vuorovaikutuksessa elementtien kanssa, esimerkiksi napsauttamalla navigointilinkkejä, ja Selenium suorittaa JavaScriptin sekä päivittää DOM-rakenteen. Tämän jälkeen käytätte samoja odotus- ja poimintatekniikoita.

Pikakysely odottamisesta

Kun kaavitte sisältöä, joka ilmestyy sivun ensimmäisen latauksen jälkeen, mikä Selenium-tekniikka on ratkaiseva sen varmistamiseksi, että sisältö on käytettävissä ennen sen poimimisen aloittamista?

Kertaus: dynaamisten tietojen poimiminen

Hienoa työtä! Olette oppineet käsittelemään dynaamista verkkosisältöä:

  • Monet sivustot käyttävät JavaScriptiä AJAX-kutsuihin, DOM-rakenteen muokkaukseen ja SPA-sovelluksiin.
  • Perinteiset työkalut, kuten Requests ja BeautifulSoup, eivät pysty suorittamaan JavaScriptiä.
  • Selenium pystyy renderöimään JavaScriptin ohjaamalla kokonaisena toimivaa selainta.
  • Eksplisiittiset odotukset ovat välttämättömiä sen varmistamiseksi, että dynaamisesti ladattu sisältö on saatavilla ennen poimimista.

Tämän taidon avulla kaavintaprojekteihinne avautuu valtava määrä nykyaikaisia verkkosivustoja!

Aloita maksutta

Opi Python tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit
12
Oppitunnit
48

Usein kysytyt kysymykset

Onko oppitunti ”Tietojen poiminta JavaScriptistä” ilmainen?

Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa Verkkosivujen kaavinta ja botit-oppimispolun 3 oppituntia, myös oppitunnin “Tietojen poiminta JavaScriptistä”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Verkkosivujen kaavinta ja botit-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Tietojen poiminta JavaScriptistä”?

Oppikaa hakemaan JavaScriptin tuottamia tai lataamia tietoja, mukaan lukien AJAX-kutsujen ja yhden sivun sovellusten sisältö. Harjoittelet Verkkosivujen kaavinta ja botit-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Verkkosivujen kaavinta ja botit-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Verkkosivujen kaavinta ja botit-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 3/4.

Kuinka kauan ”Tietojen poiminta JavaScriptistä”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Verkkosivujen kaavinta ja botit-oppitunnilla?

Kyllä. Jokainen Verkkosivujen kaavinta ja botit-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

  1. Johdatus Seleniumiin
  2. Selainvuorovaikutusten automatisointi
  3. Tietojen poiminta JavaScriptistä
  4. Dynaamisten sivujen odotusstrategiat
← Takaisin: Verkkosivujen kaavinta ja botit