DEV Community

Cover image for Step-by-Step Guide to Scraping JavaScript-Rich Websites in Laravel with PuPHPeteer
Asfia Aiman
Asfia Aiman

Posted on

Step-by-Step Guide to Scraping JavaScript-Rich Websites in Laravel with PuPHPeteer

Web scraping can be particularly challenging for JavaScript-heavy websites. Fortunately, PuPHPeteer, a PHP bridge for Puppeteer, can help. In this detailed tutorial, we'll walk through setting up a web scraper in Laravel using PuPHPeteer.

Prerequisites

Ensure you have the following installed:

  1. PHP 7.3+
  2. Node.js
  3. Composer
  4. Laravel 9+

Step 1: Set Up Laravel Project

First, create a new Laravel project or navigate to your existing project directory:

laravel new puphpeteer-scraper cd puphpeteer-scraper 
Enter fullscreen mode Exit fullscreen mode

Step 2: Install PuPHPeteer

Install PuPHPeteer via Composer and Puppeteer via npm:

composer require zoonru/puphpeteer npm install github:zoonru/puphpeteer 
Enter fullscreen mode Exit fullscreen mode

Step 3: Create a Scraper Command

Laravel Artisan commands are perfect for creating scrapers. Generate a new command:

php artisan make:command ScrapeWebsite 
Enter fullscreen mode Exit fullscreen mode

Open the newly created command file at app/Console/Commands/ScrapeWebsite.php and update it:

<?php namespace App\Console\Commands; use Illuminate\Console\Command; use Nesk\Puphpeteer\Puppeteer; use Nesk\Rialto\Data\JsFunction; class ScrapeWebsite extends Command { protected $signature = 'scrape:website'; protected $description = 'Scrape data from a JavaScript-heavy website'; public function __construct() { parent::__construct(); } public function handle() { $puppeteer = new Puppeteer; $browser = $puppeteer->launch(); $page = $browser->newPage(); $page->goto('https://example.com', ['waitUntil' => 'networkidle0']); $page->waitForSelector('#element-id'); $data = $page->evaluate(JsFunction::createWithBody(" const elements = document.querySelectorAll('.data-class'); return Array.from(elements).map(element => element.innerText); ")); print_r($data); $browser->close(); } } 
Enter fullscreen mode Exit fullscreen mode

Explanation

Command Setup: The __construct() method sets up the command. The handle() method contains the scraping logic.

Launching Puppeteer: Puppeteer is instantiated, and a browser instance is launched.

Navigating to the Website: The goto method loads the specified URL and waits until the network is idle.

Waiting for Elements: waitForSelector ensures that JavaScript-generated content is loaded.

Extracting Data: evaluate executes JavaScript in the browser context to extract the desired data.

Closing the Browser: close method closes the browser instance.

Step 4: Run the Scraper Command

Run the scraper command using Artisan:

php artisan scrape:website 
Enter fullscreen mode Exit fullscreen mode

This command will navigate to the specified website, wait for JavaScript to load, extract the data, and print it.

Additional Tips

Error Handling: Add error handling to manage navigation failures or element selection issues.

Dynamic Interaction: You can add more interaction with the page, like clicking buttons or filling forms, before extracting data.

Conclusion

PuPHPeteer makes it easy to scrape JavaScript-heavy websites using PHP within a Laravel framework. By following the steps outlined above, you can set up a robust web scraper that handles JavaScript-rendered content efficiently.

Happy scraping!

For more information, visit the PuPHPeteer GitHub page.

Top comments (0)