HTML ke PDF, jalur mudah

Sejauh ini di jalur ini, Anda telah membangun halaman satu panggilan setiap kali. Banyak dokumen lebih cepat dideskripsikan sebagai markup, format teks berbasis tag yang dipakai untuk halaman web. Dalam tutorial ini Anda menyerahkan sepotong Hypertext Markup Language (HTML) ke NextPDF, dan engine menggambar halaman untuk Anda.

Yang akan Anda bangun

Sebuah laporan satu halaman yang dirender dari satu string HTML. Laporan ini memiliki heading berwarna, paragraf pendek, dan tabel dengan baris total. Anda menatanya dengan Cascading Style Sheets (CSS), bahasa aturan yang mengontrol tampilan markup. Pada tutorial-tutorial sebelumnya Anda menggunakan fluent Application Programming Interface (API), yaitu rangkaian pemanggilan metode. Di sini Anda justru mendeskripsikan tata letak dalam markup, dan engine yang sama merendernya.

Langkah 1: Render laporan bergaya dari HTML

Buat sebuah file bernama 01-html.php di folder proyek Anda, di samping vendor. Tempelkan skrip lengkap ini:

<?php

declare(strict_types=1);

require __DIR__ . '/vendor/autoload.php';

use NextPDF\Core\Document;

@mkdir(__DIR__ . '/out');

$document = Document::createStandalone();
$document->setTitle('Monthly reading report');
$document->addPage();

$html = <<<'HTML'
<h1 style="color: #1E3A8A;">Monthly reading report</h1>

<p>This report was rendered from <strong>HTML</strong> with inline
<em>CSS</em>. The table below lists two books and their page counts.</p>

<table border="1" cellpadding="5" cellspacing="0" style="width: 100%;">
    <thead>
        <tr style="background-color: #1E3A8A; color: #FFFFFF;">
            <th style="width: 55%;">Title</th>
            <th style="width: 20%; text-align: center;">Format</th>
            <th style="width: 25%; text-align: right;">Pages</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>The Paper Trail</td>
            <td style="text-align: center;">Hardcover</td>
            <td style="text-align: right;">312</td>
        </tr>
        <tr style="background-color: #F8FAFC;">
            <td>Ink and Bytes</td>
            <td style="text-align: center;">Paperback</td>
            <td style="text-align: right;">248</td>
        </tr>
    </tbody>
    <tfoot>
        <tr style="font-weight: bold;">
            <td colspan="2" style="text-align: right;">Total pages:</td>
            <td style="text-align: right;">560</td>
        </tr>
    </tfoot>
</table>
HTML;

$document->writeHtml($html);

$document->save(__DIR__ . '/out/reading-report.pdf');

echo "Wrote out/reading-report.pdf\n";

Jalankan skrip dari folder proyek:

php 01-html.php

Anda akan melihat satu baris keluaran:

Wrote out/reading-report.pdf

Buka out/reading-report.pdf di penampil Portable Document Format (PDF) mana pun. Heading-nya berwarna biru tua, dan baris header tabel diisi dengan warna yang sama.

Apa yang baru saja terjadi

@mkdir(__DIR__ . '/out'); membuat folder keluaran. Tanda @ menyembunyikan peringatan ketika folder sudah ada, sehingga eksekusi berulang tetap senyap.
Document::createStandalone(), setTitle(), dan addPage() bekerja persis seperti pada tutorial-tutorial sebelumnya. Beralih ke markup tidak mengubah apa pun dalam penyiapan dokumen.
writeHtml() membaca string Anda satu kali, dari atas ke bawah, dan menggambar setiap elemen pada posisi saat ini. Heading dan paragraf menjadi teks bergaya. Tabel menjadi baris-baris terukur dari sel-sel bergaris tepi.
Atribut style inline membawa CSS. Engine memahami properti umum seperti color, background-color, text-align, dan width.
Tidak ada browser dan tidak ada perangkat lunak tambahan yang terlibat. Pipeline-nya adalah PHP biasa di dalam engine, sehingga skrip berjalan di mana pun instalasi Composer Anda berjalan.

Engine mendukung sebagian praktis dari HTML dan CSS, bukan segala sesuatu yang diterima browser. Apa pun yang di luar sebagian itu dilewati secara diam-diam alih-alih memunculkan error. Matriks dukungan CSS mencatat dengan tepat apa yang dicakup. Untuk penelusuran lebih mendalam tentang pipeline ini, lihat Render HTML ke halaman PDF.

Kapan memakai HTML dan kapan memakai fluent API

Kedua jalur berjalan pada engine yang sama, jadi pilih mana pun yang cocok untuk dokumen.

Pilih writeHtml() ketika dokumen terbaca seperti halaman web: heading, paragraf, daftar, dan tabel. Markup lebih cepat ditulis dan lebih mudah disunting oleh rekan tim.
Pilih fluent API ketika Anda membutuhkan penempatan yang tepat, seperti posisi tetap atau sel yang terukur secara presisi. Markup memberi Anda aliran; pemanggilan fluent memberi Anda kendali.
Periksa matriks dukungan CSS sebelum mengandalkan sebuah properti. Ketika sebuah gaya tidak dicakup, bangun bagian itu dengan pemanggilan fluent sebagai gantinya.

Batas keamanan

HTML nyata sering datang dari luar kode Anda, misalnya dari sebuah formulir atau basis data. Perlakukan HTML itu sebagai input yang tidak tepercaya, dan validasi atau bersihkan sebelum merender. Secara bawaan, pipeline internal tidak menjalankan skrip apa pun dan tidak mengambil sumber daya jarak jauh apa pun. Perilaku bawaan itu menjaga renderer tetap konservatif bahkan ketika markup-nya tidak. Jika Anda membutuhkan opsi rendering setingkat browser, lihat Pilih jalur Anda.

Jika ada yang salah

Failed to open stream: No such file or directory biasanya berarti skrip tidak dapat menemukan vendor/autoload.php. Jalankan dari folder tempat Anda menjalankan Composer.
Gaya yang hilang biasanya merupakan properti di luar sebagian yang didukung. Engine melewati apa yang tidak didukungnya alih-alih gagal. Bandingkan markup Anda dengan matriks dukungan CSS.
Sebuah exception saat merender menyebutkan masalah yang tepat. Cari di referensi error rendering dan input/output.

Untuk hal lainnya, mulailah dengan panduan pemecahan masalah.

Selanjutnya

Kini Anda dapat membangun dokumen panggilan demi panggilan dan dari markup. Selesaikan jalur ini dengan Ke mana selanjutnya. Halaman itu memetakan cookbook, referensi, dan panduan yang akan Anda pakai setelah jalur ini.