Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. Ruby

Menghasilkan PDF dari HTML dengan Rails

by
Difficulty:IntermediateLength:MediumLanguages:

Indonesian (Bahasa Indonesia) translation by ⚡ Rova Rindrata (you can also view the original English article)

Ada banyak cara untuk menghasilkan PDF di Ruby and Rails. Kemungkinannya adalah Anda sudah terbiasa dengan HTML dan CSS, jadi kita akan menggunakan PDFKit untuk menghasilkan file PDF menggunakan HTML dari view Rails standar dan kode gaya.

Pengenalan PDFKit

Secara internal, PDFKit menggunakan wkhtmltopdf (WebKit HTML to PDF), sebuah mesin yang akan mengambil HTML dan CSS, me-render menggunakan WebKit, dan mengeluarkannya sebagai PDF dengan kualitas tinggi.

Untuk memulai, instal wkhtmltopdf di komputer Anda. Anda dapat mengunduh biner-nya atau menginstal dari Brew di Mac, atau repositori Linux pilihan Anda.

Anda juga perlu menginstal pdfkit gem, dan kemudian menjalankan sedikit Ruby berikut untuk menghasilkan PDF dengan teks "Hello Envato!"

Anda harus memiliki file baru bernama hello.pdf dengan teksnya di bagian atas.

An example of the PDF that was generated

Contoh dari PDF yang dihasilkanPDFKit juga memungkinkan Anda untuk menghasilkan PDF dari URL. Jika Anda ingin menghasilkan PDF dari beranda Google, Anda dapat menjalankan:

Seperti yang Anda lihat, saya menentukan ukuran page_size-secara default, A4 digunakan. Anda dapat melihat daftar opsi lengkap di sini.

An example of the Google homepage in PDF format

Menata PDF Anda Menggunakan CSS

Sebelumnya saya menyebutkan bahwa kita akan menghasilkan file PDF menggunakan HTML dan CSS. Dalam sampel ini, saya telah menambahkan sedikit CSS untuk mendesain HTML untuk faktur sampel, seperti yang Anda lihat:

Jika Anda menjalankan skrip ini, file envato_invoice.pdf akan dibuat. Foto ini menunjukkan hasil dari faktur sampel:

An example of an Envato invoice PDF

Contoh dari PDF faktur EnvatoSeperti yang Anda lihat, PDFKit sangat mudah digunakan, jika Anda sudah terbiasa dengan HTML dan CSS. Anda dapat terus menyesuaikan atau menata dokumen ini sesuka Anda.

Menggunakan PDFKit dari Aplikasi Rails

Sekarang mari kita lihat bagaimana menggunakan PDFKit dalam konteks aplikasi Rails, sehingga kita dapat secara dinamis menghasilkan file PDF menggunakan data dari model kita. Di bagian ini kita akan membangun aplikasi rails sederhana untuk menghasilkan "Envato Invoice" sebelumnya secara dinamis. Mulailah dengan membuat aplikasi rails baru dan menambahkan tiga model:

Sekarang, kita harus menambahkan beberapa data sampel ke database. Tambahkan potongan kode ini ke db/seeds.rb.

Jalankan rake db:seed di terminal Anda untuk menambahkan faktur sampel ke database.

Kita juga tertarik untuk membuat daftar faktur dan detail satu faktur di aplikasi kita, jadi menggunakan generator rails, jalankan rails generate controller Invoices index show untuk membuat controller dan views.

app/controllers/invoices_controller.rb

app/views/invoices/index.html.erb

Kita perlu memodifikasi rute rails untuk mengarahkan ke InvoicesController secara default, jadi edit config/routes.rb:

Mulai rails server Anda dan navigasikan ke localhost:3000 untuk melihat daftar faktur:

List of invoices

app/views/invoices/show.html.erb

CSS untuk halaman detail faktur ini telah dipindahkan ke app/assets/stylesheets/application.scss

Kemudian ketika Anda mengklik faktur di halaman daftar utama, Anda akan melihat detailnya:

Invoice view

View fakturPada titik ini, kita siap untuk menambahkan fungsionalitas ke aplikasi rails kita untuk melihat atau mengunduh faktur dalam PDF.

Kelas InvoicePdf untuk Menangani Render PDF

Untuk me-render faktur dari aplikasi rails kita ke PDF, kita perlu menambahkan tiga gem ke Gemfile: PDFKit, render_anywhere, dan wkhtmltopdf-binary. Secara default, rails hanya memungkinkan Anda untuk me-render template dari controller, tetapi dengan menggunakan render_anywhere, kita bisa me-render template dari model atau pekerjaan latar belakang.

Agar tidak mencemari controller kita dengan terlalu banyak logika, saya akan membuat kelas InvoicePdf baru di dalam folder app/models untuk membungkus logika untuk menghasilkan PDF.

Kelas ini hanya mengambil faktur untuk di-render sebagai parameter pada constructor kelas. Metode private as_html sedang membaca view template invoices/pdf dan layout_pdf yang kita gunakan untuk menghasilkan HTML yang perlu kita render sebagai PDF. Terakhir, metode to_pdf menggunakan PDFKit untuk menyimpan file PDF di folder public rails.

Mungkin Anda ingin membuat nama dinamis di aplikasi nyata Anda sehingga file PDF tidak ditimpa secara tidak sengaja. Anda mungkin ingin menyimpan file di AWS S3 atau folder pribadi juga, tapi itu di luar cakupan tutorial ini.

/app/views/invoices/pdf.html.erb

/app/views/layouts/invoice_pdf.erb

Satu hal yang perlu diperhatikan dalam file layout ini adalah bahwa kita me-render gaya dalam layout. WkHtmlToPdf bekerja lebih baik jika kita memberikan gaya dengan cara ini.

DownloadsController untuk Me-render Faktur PDF

Pada titik ini kita membutuhkan rute dan controller yang memanggil kelas InvoicePdf untuk mengirim file PDF ke browser, jadi edit config/routes.rb untuk menambahkan sumber daya bersarang:

Jika kita menjalankan rake routes, kita melihat daftar rute yang tersedia di aplikasi:

Tambahkan app/controllers/downloads_controller.rb:

Seperti yang Anda lihat, ketika permintaan meminta file PDF, metode send_invoice_pdf sedang memproses permintaannya. Metode invoice_pdf hanya menemukan faktur dari database berdasarkan id, dan membuat instance dari InvoicePdf. Kemudian send_invoice_pdf hanya memanggil metode to_pdf, untuk mengirim file PDF yang dihasilkan ke browser.

Satu hal yang perlu diperhatikan adalah kita mengirimkan parameter disposition: "inline" ke send_file. Parameter ini mengirim file ke browser, dan itu akan ditampilkan. Jika Anda ingin memaksa file untuk diunduh, maka Anda harus memberikan disposition: "attachment".

Tambahkan tombol unduh ke template tampilan faktur Anda app/views/invoices/show.html.erb:

Jalankan aplikasi, navigasikan ke rincian faktur, klik unduh, dan tab baru akan terbuka menampilkan Faktur PDF.

Invoice view PDF dynamically generated

Render PDF sebagai HTML dalam Pengembangan

Saat Anda sedang mengerjakan markup untuk PDF Anda, keharusan untuk menghasilkan PDF setiap kali Anda ingin menguji suatu perubahan terkadang bisa lambat. Untuk alasan ini, dapat melihat HTML yang akan dikonversi ke PDF sebagai HTML biasa bisa sangat berguna. Kita hanya perlu mengedit /app/controllers/downloads_controller.rb.

Sekarang metode show juga merespons permintaan HTML dalam mode pengembangan. Rute untuk faktur PDF akan seperti http://localhost:3000/invoices/1/download.pdf. Jika Anda mengubahnya ke http://localhost:3000/invoices/1/download.html, Anda akan melihat faktur dalam HTML menggunakan markup yang digunakan untuk menghasilkan PDF.

Dengan kode di atas, membuat file PDF menggunakan Ruby on Rails sangat mudah dengan asumsi Anda terbiasa dengan bahasa Ruby dan kerangka kerja Rails. Mungkin aspek terbaik dari keseluruhan proses adalah Anda tidak perlu mempelajari bahasa markup baru atau spesifik tentang pembuatan PDF.

Semoga tutorial ini terbukti bermanfaat. Silakan tinggalkan pertanyaan, komentar, dan umpan balik di komentar dan saya akan dengan senang hati menindaklanjutinya.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.