解決 PHP 的 dompdf 中文字體亂碼的方法

記錄一下一個之前解決過的問題。

在使用 php 的 dompdf 會有中文字無法正確讀取的問題,這主要是字型的關係,官方有提供一個解決方法。

先說什麼是 dompdf 請參考開源程式說明

Dompdf 是一個 HTML 到 PDF 轉換器

從本質上講,dompdf(主要)是一個用 PHP 編寫的、符合CSS 2.1 的HTML 佈局和渲染引擎。它是一個樣式驅動的渲染器:它將下載並讀取外部樣式表、內聯樣式標籤以及各個 HTML 元素的樣式屬性。它還支援大多數表現性 HTML 屬性。

這是一個 PHP 的工具,有幾點注意:

  1. 如果需要連外部圖片的話需要開啟設定,關鍵字請找:isRemoteEnabled
  2. 圖片或是連結請用絕對路徑。
  3. 不是全支援 CSS 3
  4. 通常會指定紙張樣式,這塊 html 需要考慮平面印刷的特色才行。

接下來讓 AI 說明,使用 dompdf 支援可使用中文字型的方法。


要在 Dompdf 中正確顯示中文,您需要引入支援中文的字體。以下是詳細步驟:

  1. 安裝 Dompdf:如果尚未安裝,請使用 Composer 安裝 Dompdf:
   composer require dompdf/dompdf
  1. 下載 load_font.php 工具:從 Dompdf 的 utils 儲存庫下載 load_font.php,並將其放置在 vendor/dompdf/dompdf 目錄下,與 libsrc 目錄同級。
  2. 下載中文字體:取得支援中文的字體檔案(如 simsun.ttfmsyh.ttf),並將其放置在與 load_font.php 相同的目錄中。
  3. 修改 load_font.php:確保 load_font.php 正確載入自動加載器。
   // 確認以下路徑正確
   require_once "../../autoload.php";
  1. 安裝字體:在命令列中執行以下命令來安裝字體:
   php load_font.php 字體名稱 字體檔案.ttf

例如,若字體名稱為 simsun,字體檔案為 simsun.ttf,則執行:

   php load_font.php simsun simsun.ttf
  1. 確認字體安裝成功:在 vendor/dompdf/dompdf/lib/fonts 目錄中,應該能看到新生成的字體檔案(如 simsun.ttfsimsun.ufm)。此外,檢查 installed-fonts.json 檔案,確認字體資訊已被記錄。
  2. 在 CSS 中引用字體:在您的 HTML 或 CSS 中,使用 @font-face 規則引用新安裝的字體,並在需要的地方設置 font-family
   @font-face {
       font-family: 'simsun';
       src: url('path/to/simsun.ttf') format('truetype');
   }
   body {
       font-family: 'simsun';
   }

請確保 src 的路徑正確指向字體檔案的位置。

  1. 生成 PDF:在生成 PDF 的程式碼中,確保載入的 HTML 包含上述字體設定。以下是範例程式碼:
   use Dompdf\Dompdf;
   use Dompdf\Options;

   // 初始化 Dompdf
   $options = new Options();
   $options->set('isRemoteEnabled', true);
   $dompdf = new Dompdf($options);

   // 載入 HTML 內容
   $html = '<html><head><style>
   @font-face {
       font-family: "simsun";
       src: url("path/to/simsun.ttf") format("truetype");
   }
   body {
       font-family: "simsun";
   }
   </style></head><body>您的中文內容</body></html>';
   $dompdf->loadHtml($html);

   // 設定紙張大小和方向
   $dompdf->setPaper('A4', 'portrait');

   // 生成 PDF
   $dompdf->render();

   // 輸出 PDF
   $dompdf->stream('document.pdf');

請確保 @font-face 中的 src 路徑在 HTML 中是可訪問的。

按照上述步驟,您應該能夠在 Dompdf 中成功引入並使用中文字體,確保生成的 PDF 正確顯示中文內容。


我在 Github 上弄了兩個頁面可以把他架設起來試試看,請點這裡

同場加映,有時我們想找中文開源字型,請到這裡

可以 filiter 你要的字型,點擊搜尋出來的字型後再點擊 「Get font」按鈕。

在這裡可以從 Download all 中下載字型,也可以從 embed code 中找到字型的連結。

舉例像是抓出來的這個:

https://fonts.googleapis.com/css2?family=Noto+Sans+TC:[email protected]&family=Noto+Serif+TC:[email protected]&display=swap

打開來會得到一串 @font-face 的 css 資料,除了可以引用以外,也可以從裡面複製處來使用。 以上!


已發佈

分類:

作者: