LoginSignup
5
1

More than 3 years have passed since last update.

Laravel-SnappyでPDFを出力する際のページ番号の表示を制御する

Last updated at Posted at 2020-02-20

はじめに

この記事ではLaravel-Snappyを利用してPDF出力処理を既に実装されていることを前提にしています。
Laravel-Snappyの導入方法については触れません。

ページ番号の表示方法

オプションで表示する方法

Laravel-Snappyを使ってPDFにページ番号を表示したい場合、以下のようにPDFインスタンスを作成する際のオプションを指定することで簡単に実装することができます。

$pdf = PDF::loadView('pdf')
    ->setOption('footer-center', '[page] ページ')); // フッター中央 [page]でページ番号が自動で入ります

ただし、出力されるPDFの総ページ数が1ページの場合でも表示されてしまいます。
1ページの時はページ数を非表示にする場合、ページの表示箇所を自前で実装する必要があるようです。
オプション指定の方法でどうにかできないか調べましたが見つかりませんでした。

自前で表示する方法

ページ数の情報はPDFに読み込ませるHTMLのLocationオブジェクトから取得することができます。
Location.hrefには以下が格納されています。
pageが現在のページ番号
topageが総ページ数

file:///tmp/knp_snappy5e3b69aa559ad4.24507587.html?page=1&section=&sitepage=1&title=&subsection=&frompage=1&subsubsection=&isodate=2020-02-06&topage=2&doctitle=&sitepages=2&webpage=&time=&date=

この情報を用いて、ページ番号を表示する為にフッターを用意します。

footer.blade.php
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
</head>
<body class="bg-white">
<div class="text-center">
    <span id="pdfkit_page_current"></span>
</div>
<script type="text/javascript">
    (function () {
        var pdfInfo = {};
        var x = document.location.search.substring(1).split('&');
        for (var i in x) {
            var z = x[i].split('=', 2);
            pdfInfo[z[0]] = unescape(z[1]);
        }
        var page = pdfInfo.page || 1; // ページ番号
        var pageCount = pdfInfo.topage || 1; // 総ページ数
        // 改ページがある場合のみページ番号を表示します
        if (pageCount > 1) {
            document.getElementById('pdfkit_page_current').textContent = page;
        }
    })();
</script>
</body>
</html>

用意したフッターをPDFに設定するにはオプションで指定します。

$pdf = PDF::loadView('pdf')
    ->setOption('footer-html', \View::make('footer')->render() // 用意したフッターを設定
    ->setOption('margin-bottom', 10)); // フッターの余白を設定します

以上になります。

5
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
1