DEV Community

It's Just Nifty
It's Just Nifty

Posted on • Originally published at niftylittleme.com on

Downloading Webpages As PDFs With PHP And JavaScript

The results - Cropped Screenshot

Converting HTML to a PDF in PHP was easy. Let's bring it up a notch and convert a webpage to a PDF file using PHP and JavaScript.

To do this, you will need to install Composer and Node.

After installing those things, you will need to install Dompdf using Composer and Puppeteer using npm (Node package manager):

composer require dompdf/dompdf

npm install puppeteer
Enter fullscreen mode Exit fullscreen mode

Create a HTML file (Example: index.html):

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Webpage to Pdf</title>
</head>
<body>
    <main>
        <form action="web-pdf.php" method="get">
            <label for="url">Website URL:</label>
            <input type="text" id="url" name="url" required>
            <button type="submit">Download Content</button>
        </form>
    </main>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Create a PHP file (Example: web-pdf.php):

<?php
require 'vendor/autoload.php';

use Dompdf\Dompdf;

if (isset($_GET['url'])) {
    $url = escapeshellarg($_GET['url']);
    $content = shell_exec("node download.js {$url}");

    try {
        convertHTML($content);
    } catch (Exception $e) {
        echo "Some error: " . $e->getMessage();
    }
} else {
    echo "No URL provided.";
}

function convertHTML($content) {
    $dompdf = new Dompdf();
    $dompdf->loadHtml($content);

    // Setup the paper size and orientation
    $dompdf->setPaper('A4', 'landscape');

    // Render the HTML as PDF
    $dompdf->render();

    ob_end_clean();

    // Output the generated PDF
    $dompdf->stream();
}
?>
Enter fullscreen mode Exit fullscreen mode

Lastly, create a JavaScript File to use Puppeteer (Example: download.js):

const puppeteer = require('puppeteer');

// Get URL from command-line arguments
const url = process.argv[2];

(async () => {
  try {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    await page.goto(url); // Use the URL passed from PHP
    await page.waitForSelector('main', { timeout: 10000 }); // Adjust selector and timeout as needed

    const content = await page.content();
    console.log(content);

    await browser.close();
  } catch (error) {
    console.error('Error:', error);
  }
})();
Enter fullscreen mode Exit fullscreen mode

Note: Remove the ten second timeout or change the element (main) if the content is not what you expect.

There you go! Just like that, you have a webpage to PDF converter.

Happy Coding Folks!

Sentry blog image

How I fixed 20 seconds of lag for every user in just 20 minutes.

Our AI agent was running 10-20 seconds slower than it should, impacting both our own developers and our early adopters. See how I used Sentry Profiling to fix it in record time.

Read more

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more