Adakah pengikis anda tersekat apabila cuba memuatkan data daripada halaman web dinamik? Adakah anda kecewa dengan skrol yang tidak terhingga atau butang "Muatkan lagi" yang menjengkelkan itu?

Anda tidak bersendirian. Banyak tapak web hari ini melaksanakan reka bentuk ini untuk meningkatkan pengalaman pengguna—tetapi tapak web ini boleh mencabar pengikis web.

Tutorial ini akan membimbing anda melalui panduan mesra pemula untuk mengikis halaman tunjuk cara dengan butang Muat Lagi. Begini rupa halaman web sasaran:

Pada akhirnya, anda akan belajar cara untuk:

• Sediakan Selenium untuk mengikis web.
• Automasikan interaksi butang "Muatkan lagi".
• Ekstrak data produk seperti nama, harga dan pautan.

Jom selami!

Langkah 1: Prasyarat

Sebelum menyelam, pastikan prasyarat berikut:

• Python Dipasang: Muat turun dan pasang versi Python terbaharu daripada python.org, termasuk pip semasa persediaan.
• Pengetahuan Asas: Kebiasaan dengan konsep mengikis web, pengaturcaraan Python dan bekerja dengan perpustakaan seperti permintaan, BeautifulSoup dan Selenium.

Perpustakaan Diperlukan:

• Permintaan: Untuk menghantar permintaan HTTP.
• BeautifulSoup: Untuk menghuraikan kandungan HTML.
• Selenium: Untuk mensimulasikan interaksi pengguna seperti klik butang dalam penyemak imbas.

Anda boleh memasang perpustakaan ini menggunakan arahan berikut dalam terminal anda:

pip install requests beautifulsoup4 selenium

Sebelum menggunakan Selenium, anda mesti memasang pemacu web yang sepadan dengan penyemak imbas anda. Untuk tutorial ini, kami akan menggunakan Google Chrome dan ChromeDriver. Walau bagaimanapun, anda boleh mengikuti langkah yang serupa untuk penyemak imbas lain seperti Firefox atau Edge.

Pasang Pemacu Web

1. Semak versi penyemak imbas anda:

2. Buka Google Chrome dan navigasi ke Bantuan > Mengenai Google Chrome daripada menu tiga titik untuk mencari versi Chrome.

3. Muat turun ChromeDriver:

4. Lawati halaman muat turun ChromeDriver.

5. Muat turun versi pemacu yang sepadan dengan versi Chrome anda.

6. Tambah ChromeDriver pada PATH sistem anda:
   Ekstrak fail yang dimuat turun dan letakkan dalam direktori seperti /usr/local/bin (Mac/Linux) atau C:WindowsSystem32 (Windows).

Sahkan Pemasangan

Mulakan fail Python scraper.py dalam direktori projek anda dan uji bahawa semuanya telah disediakan dengan betul dengan menjalankan coretan kod berikut:

from selenium import webdriver
driver = webdriver.Chrome() # Ensure ChromeDriver is installed and in PATH
driver.get("https://www.scrapingcourse.com/button-click")
print(driver.title)
driver.quit()

Anda boleh melaksanakan kod fail di atas dengan menjalankan arahan berikut pada terminal anda:

pip install requests beautifulsoup4 selenium

Jika kod di atas berjalan tanpa ralat, ia akan memutar antara muka penyemak imbas dan membuka URL halaman demo seperti yang ditunjukkan di bawah:

Selenium kemudiannya akan mengekstrak HTML dan mencetak tajuk halaman. Anda akan melihat output seperti ini -

from selenium import webdriver
driver = webdriver.Chrome() # Ensure ChromeDriver is installed and in PATH
driver.get("https://www.scrapingcourse.com/button-click")
print(driver.title)
driver.quit()

Ini mengesahkan bahawa Selenium sedia untuk digunakan. Dengan semua keperluan dipasang dan sedia untuk digunakan, anda boleh mula mengakses kandungan halaman demo.

Langkah 2: Dapatkan Akses kepada Kandungan

Langkah pertama ialah mengambil kandungan awal halaman, yang memberikan anda gambaran garis dasar HTML halaman. Ini akan membantu anda mengesahkan ketersambungan dan memastikan titik permulaan yang sah untuk proses mengikis.

Anda akan mendapatkan semula kandungan HTML URL halaman dengan menghantar permintaan GET menggunakan perpustakaan Permintaan dalam Python. Ini kodnya:

python scraper.py

Kod di atas akan mengeluarkan HTML mentah yang mengandungi data untuk 12 produk pertama.

Pratonton pantas HTML ini memastikan permintaan itu berjaya dan anda menggunakan data yang sah.

Langkah 3: Muatkan Lebih Banyak Produk

Untuk mengakses produk yang selebihnya, anda perlu mengklik butang "Muatkan lagi" secara pemprograman pada halaman sehingga tiada lagi produk tersedia. Memandangkan interaksi ini melibatkan JavaScript, anda akan menggunakan Selenium untuk mensimulasikan klik butang.

Sebelum menulis kod, mari kita periksa halaman untuk mencari:

• Pemilih butang "Muat lagi" (muat-lebih-btn).
• Div yang memegang butiran produk (item produk).

Anda akan mendapat semua produk dengan memuatkan lebih banyak produk, memberikan anda set data yang lebih besar dengan menjalankan kod berikut:

Load More Button Challenge to Learn Web Scraping - ScrapingCourse.com

Kod ini membuka penyemak imbas, menavigasi ke halaman dan berinteraksi dengan butang "Muatkan lagi". HTML yang dikemas kini, kini mengandungi lebih banyak data produk, kemudian diekstrak.

Jika anda tidak mahu Selenium membuka penyemak imbas setiap kali anda menjalankan kod ini, ia juga menyediakan keupayaan penyemak imbas tanpa kepala. Pelayar tanpa kepala mempunyai semua fungsi pelayar web sebenar tetapi tiada Antara Muka Pengguna Grafik (GUI).

Anda boleh mendayakan mod tanpa kepala untuk Chrome dalam Selenium dengan mentakrifkan objek ChromeOptions dan menyerahkannya kepada pembina Chrome WebDriver seperti ini:

import requests
# URL of the demo page with products
url = "https://www.scrapingcourse.com/button-click"
# Send a GET request to the URL
response = requests.get(url)
# Check if the request was successful
if response.status_code == 200:
    html_content = response.text
    print(html_content) # Optional: Preview the HTML
else:
    print(f"Failed to retrieve content: {response.status_code}")

Apabila anda menjalankan kod di atas, Selenium akan melancarkan tika Chrome tanpa kepala, jadi anda tidak akan melihat tetingkap Chrome lagi. Ini sesuai untuk persekitaran pengeluaran yang anda tidak mahu membazir sumber pada GUI semasa menjalankan skrip mengikis pada pelayan.

Sekarang kandungan HTML yang lengkap diperoleh dengan mengekstrak butiran khusus tentang setiap produk sudah tiba masanya.

Langkah 4: Menghuraikan Maklumat Produk

Dalam langkah ini, anda akan menggunakan BeautifulSoup untuk menghuraikan HTML dan mengenal pasti elemen produk. Kemudian, anda akan mengeluarkan butiran penting untuk setiap produk, seperti nama, harga dan pautan.

pip install requests beautifulsoup4 selenium

Dalam output, anda seharusnya melihat senarai berstruktur butiran produk, termasuk nama, URL imej, harga dan pautan halaman produk, seperti ini -

from selenium import webdriver
driver = webdriver.Chrome() # Ensure ChromeDriver is installed and in PATH
driver.get("https://www.scrapingcourse.com/button-click")
print(driver.title)
driver.quit()

Kod di atas akan menyusun data HTML mentah ke dalam format berstruktur, menjadikannya lebih mudah untuk digunakan dan menyediakan data output untuk pemprosesan selanjutnya.

Langkah 5: Eksport Maklumat Produk ke CSV

Kini anda boleh menyusun data yang diekstrak ke dalam fail CSV, yang memudahkan anda menganalisis atau berkongsi. Modul CSV Python membantu dengan ini.

python scraper.py

Kod di atas akan membuat fail CSV baharu dengan semua butiran produk yang diperlukan.

Berikut ialah kod lengkap untuk gambaran keseluruhan:

Load More Button Challenge to Learn Web Scraping - ScrapingCourse.com

Kod di atas akan mencipta products.csv yang akan kelihatan seperti ini:

import requests
# URL of the demo page with products
url = "https://www.scrapingcourse.com/button-click"
# Send a GET request to the URL
response = requests.get(url)
# Check if the request was successful
if response.status_code == 200:
    html_content = response.text
    print(html_content) # Optional: Preview the HTML
else:
    print(f"Failed to retrieve content: {response.status_code}")

Langkah 6: Dapatkan Data Tambahan untuk Produk Teratas

Sekarang, katakan anda ingin mengenal pasti 5 produk teratas dengan harga tertinggi dan mengekstrak data tambahan (seperti penerangan produk dan kod SKU) daripada halaman individu mereka. Anda boleh melakukannya menggunakan kod seperti berikut:

from selenium import webdriver
from selenium.webdriver.common.by import By
import time
# Set up the WebDriver (make sure you have the appropriate driver installed, e.g., ChromeDriver)
driver = webdriver.Chrome()
# Open the page
driver.get("https://www.scrapingcourse.com/button-click")
# Loop to click the "Load More" button until there are no more products
while True:
    try:
        # Find the "Load more" button by its ID and click it
        load_more_button = driver.find_element(By.ID, "load-more-btn")
        load_more_button.click()
        # Wait for the content to load (adjust time as necessary)
        time.sleep(2)
    except Exception as e:
        # If no "Load More" button is found (end of products), break out of the loop
        print("No more products to load.")
        break
# Get the updated page content after all products are loaded
html_content = driver.page_source
# Close the browser window
driver.quit()

Berikut ialah kod lengkap untuk gambaran keseluruhan:

from selenium import webdriver
from selenium.webdriver.common.by import By

import time

# instantiate a Chrome options object
options = webdriver.ChromeOptions()

# set the options to use Chrome in headless mode
options.add_argument("--headless=new")

# initialize an instance of the Chrome driver (browser) in headless mode
driver = webdriver.Chrome(options=options)

...

Kod ini mengisih produk mengikut harga dalam tertib menurun. Kemudian, untuk 5 produk teratas dengan harga tertinggi, skrip membuka halaman produk mereka dan mengekstrak penerangan produk dan SKU menggunakan BeautifulSoup.

Keluaran kod di atas akan menjadi seperti ini:

from bs4 import BeautifulSoup
# Parse the page content with BeautifulSoup
soup = BeautifulSoup(html_content, 'html.parser')
# Extract product details
products = []
# Find all product items in the grid
product_items = soup.find_all('div', class_='product-item')
for product in product_items:
    # Extract the product name
    name = product.find('span', class_='product-name').get_text(strip=True)

    # Extract the product price
    price = product.find('span', class_='product-price').get_text(strip=True)

    # Extract the product link
    link = product.find('a')['href']

    # Extract the image URL
    image_url = product.find('img')['src']

    # Create a dictionary with the product details
    products.append({
        'name': name,
        'price': price,
        'link': link,
        'image_url': image_url
})
# Print the extracted product details
for product in products[:2]:
    print(f"Name: {product['name']}")
    print(f"Price: {product['price']}")
    print(f"Link: {product['link']}")
    print(f"Image URL: {product['image_url']}")
    print('-' * 30)

Kod di atas akan mengemas kini products.csv dan ia kini akan mempunyai maklumat seperti ini:

Name: Chaz Kangeroo Hoodie
Price: 
Link: https://scrapingcourse.com/ecommerce/product/chaz-kangeroo-hoodie
Image URL: https://scrapingcourse.com/ecommerce/wp-content/uploads/2024/03/mh01-gray_main.jpg
------------------------------
Name: Teton Pullover Hoodie
Price: 
Link: https://scrapingcourse.com/ecommerce/product/teton-pullover-hoodie
Image URL: https://scrapingcourse.com/ecommerce/wp-content/uploads/2024/03/mh02-black_main.jpg
------------------------------
…

Kesimpulan

Mengikis halaman dengan butang tatal tak terhingga atau "Muatkan lagi" mungkin kelihatan mencabar, tetapi menggunakan alatan seperti Requests, Selenium dan BeautifulSoup memudahkan proses.

Tutorial ini menunjukkan cara untuk mendapatkan dan memproses data produk daripada halaman tunjuk cara, menyimpannya dalam format berstruktur untuk akses cepat dan mudah.

Lihat semua coretan kod di sini.

Atas ialah kandungan terperinci Mengikis Halaman Tatal Tak Terhingga dengan Butang &#Load More': Panduan Langkah demi Langkah. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!