【Laravel】domPDF で作成したPDFが css を認識してくれない。解決方法は？

2021.07.18

　Laravel でプログラミングをするにあたって、PDFファイルを出力させるために、domPDFを使用している人もいるかと思います。

GitHub - barryvdh/laravel-dompdf: A DOMPDF Wrapper for Laravel
A DOMPDF Wrapper for Laravel. Contribute to barryvdh/laravel-dompdf development by creating an account on GitHub.
github.com

また、下記のようにHTML出力させてからスタイルシート(css)の調整をしたのに、PDF出力すると思ったようなレイアウトになっていないことがあるのではないでしょうか？

return view('ビューファイル名'); // デバッグ時の確認用。PDF出力時はコメントアウトする
// PDF出力時
$pdf = PDF::loadView('ビューファイル名');
return $pdf->stream();
おじさん
おじさん

おじさんもハマっていたのですが、原因はパスの指定方法にありました。

動作環境の例

blade ファイルと css の配置は下記のとおりです。

/
└home/
 └laravel/ ... laravel インストールディレクトリ
  ├public/
  │└css/
  │ ├reset.css ... ブラウザのデフォルト値を初期化用のCSS
  │ └pdf.css ... PDFのレイアウト情報記載用のCSS
  └resources/
   └views/
    └pdf.blade.php ... PDF出力に使用する blade ファイル

うまくいかなかった例

　最初、pdf.blade.php に css を認識させるよう、下記のように記載しました。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="../css/reset.css">
  <link rel="stylesheet" href="../css/pdf.css">
</head>
<body>

　デバッグ作業時に出力したHTMLでは、問題なく css を認識してくれたのですが、PDF出力すると css を認識してくれませんでした。

おじさん
おじさん

もしかすると、domPDFはパスの認識方法が違うのでは？
と考えました。

　次に試したのは、下記のような記載です。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="{{asset('/css/reset.css')}}">
  <link rel="stylesheet" href="{{asset('/css/pdf.css'}}">
</head>
<body>

　asset() は、public ディレクトリのパスを返すヘルパー関数です。
これはイケるかと思ったのですが、おじさんの環境ではタイムアウトしてしまいました。

うまくいった例

うまく css を認識してくれたのは、下記のような記載です。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
/* HTMLデバッグ時の確認用
  <link rel="stylesheet" href="../css/reset.css">
  <link rel="stylesheet" href="../css/pdf.css">
*/
  <link rel="stylesheet" href="{{public_path('css/reset.css')}}"> // 
  <link rel="stylesheet" href="{{public_path('css/pdf.css')}}">
</head>
<body>

　pubic_path() は、asset() 同様、public ディレクトリのパスを返すヘルパー関数ですが、asset() がURLを返すのに対して、pubic_path() は完全パスを返します。
本記事の例では、以下の値を返します。

public_path('css/reset.css') ⇒/home/laravel/public/css/reset.css
public_path('css/pdf.css') ⇒ /home/laravel/public/css/pdf.css

まとめ

　domPDF を使用する際、スタイルシートのパスは public_path() ヘルパー関数を使用しましょう。

以上、参考になればうれしいです。

コメント