LoginSignup
4
1
記事投稿キャンペーン 「2024年!初アウトプットをしよう」

pdf-libで日本語のカスタムフォント使用時にpdfが作成できない

Posted at

pdf-libで日本語のカスタムフォント使用時にpdfが作成されず、真っ白な状態になってしまった。
特にエラーなどは表示されていない状態だったのでどこがまずいのかがわからなかった。

最初のコードは以下

const pdfDataUri = await pdfDoc.saveAsBase64({ dataUri: true });
document.getElementById('pdf').src = pdfDataUri;

日本語フォントを使って正常にpdfを作成できているサンプルコードを探したところ以下のように読み込んでいたので、同じように変更したところ見事に作成できた。

const pdfBytes = await pdfDoc.save();
const file = new Blob([pdfBytes], { type: 'application/pdf' });
const fileURL = URL.createObjectURL(file);
document.getElementById('pdf').src = fileURL;

どうやらsaveAsBase64で読み込んでいた部分が問題だったようである。

解決後に改めて検索したところ類似のissueがあり、詳細はおそらくこれと一緒だろうと思われる。(saveAsBase64 fontで検索)
小さなサイズの日本語フォントだとsaveAsBase64でも表示されたのでサイズが原因であったと思われる。
Firefoxだとエラー表示されるらしいので色んなブラウザで試してみた方が早く解決できたかもしれない。

Something wrong with custom font. #430
https://github.com/Hopding/pdf-lib/issues/430

以上です。

4
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
4
1