PDF.js エラーいろいろ覚書

これは個人的な覚書です。

pdf.js利用時に出力されたエラー/ワーニングの対処策です。

エラー その1

'Error: The browser/environment lacks native support for critical functionality used by the PDF.js library (e.g. ReadableStream); please use a legacy-build instead.'

出力箇所はここです。

PDFJSDevとReadableStreamがundefinedだとエラーになります。

if ((typeof PDFJSDev === "undefined" || PDFJSDev.test("SKIP_BABEL"))
 && typeof ReadableStream === "undefined") { /* (snip) */ }

解決策

サンプル にしたがって pdfjs-dist/legacy/build/pdf.jsを使います。

エラー その2

Setting up fake worker failed: "Cannot find module './pdf.worker.js'

または

Setting up fake worker failed: "Cannot read properties of undefined (reading 'setup')"

または

Setting up fake worker failed: "The "id" argument must be of type string. Received an instance of Object".

解決策

GlobalWorkerOptions.workerSrcにpdf.worker.jsのパスをセットします。

import * as pdfjsLib from 'pdfjs-dist/legacy/build/pdf';

pdfjsLib.GlobalWorkerOptions.workerSrc = 'pdfjs-dist/legacy/build/pdf.worker';

webpackするのなら、webpackの中でファイルを出力します。

webpack.config.js

module.exports = {
  entry: {
    "pdf.worker": "pdfjs-dist/legacy/build/pdf.worker.entry",
  },
  output: {
    filename: "[name].js",
  },
};

実際にパスをどうするかは、また考慮が必要そうです。

エラー その3

Warning: fetchStandardFontData: failed to fetch file "FoxitSansBold.pfb" with "UnknownErrorException: The standard font "baseUrl" parameter must be specified, ensure that the "standardFontDataUrl" API parameter is provided.".

解決策

node_modules/pdfjs-dist/standard_fontsの下に、フォントファイル達があります。
直接参照するか、プログラムから見える位置にコピーします。

pdfjslib.getDocumentの引数でパスを指定します。

import * as pdfjsLib from 'pdfjs-dist/legacy/build/pdf';

const document = pdfjsLib.getDocument({
      standardFontDataUrl: 'フォントファイルを置いたパス',
});