mozilla/pdf.js

# PDF.js [](https://github.com/mozilla/pdf.js/actions/workflows/ci.yml?query=branch%3Amaster) [](https://codecov.io/gh/mozilla/pdf.js) [PDF.js](https://mozilla.github.io/pdf.js/) 是一个使用 HTML5 构建的便携文档格式 (PDF) 查看器。 PDF.js 是由社区驱动并受 Mozilla 支持的。我们的目标是 创建一个通用的、基于 Web 标准的平台，用于解析和 渲染 PDF。 ## 入门 ### 在线演示 请注意，“现代浏览器”版本假定原生支持 最新的 JavaScript 特性；另请参阅[此 wiki 页面](https://github.com/mozilla/pdf.js/wiki/Frequently-Asked-Questions#faq-support)。 + 现代浏览器：https://mozilla.github.io/pdf.js/web/viewer.html + 旧版浏览器：https://mozilla.github.io/pdf.js/legacy/web/viewer.html ### 浏览器扩展 #### Firefox PDF.js 已内置于 Firefox 19+ 版本中。 #### Chrome + Chrome 的官方扩展可以从 [Chrome 网上应用店](https://chrome.google.com/webstore/detail/pdf-viewer/oemmndcbldboiebfnladdacbdfmadadm)安装。 *此扩展由 [@Rob--W](https://github.com/Rob--W) 维护。* + 构建您自己的扩展 - 获取如下所述的代码并执行 `npx gulp chromium`。然后打开 Chrome，转到 `Tools > Extension` 并从 `build/chromium` 目录加载（未打包的）扩展。 ### PDF 调试器 使用 https://mozilla.github.io/pdf.js/internal-viewer/web/debugger.html 浏览 PDF 文档的内部结构 ## 获取代码 要获取当前代码的本地副本，请使用 git 克隆它： ``` $ git clone https://github.com/mozilla/pdf.js.git $ cd pdf.js ``` 接下来，通过[官方包](https://nodejs.org)或通过 [nvm](https://github.com/creationix/nvm)安装 Node.js。如果一切顺利，安装 PDF.js 的所有依赖项： ``` $ npm install ``` 最后，您需要启动本地 Web 服务器，因为某些浏览器不允许使用 `file://` URL 打开 PDF 文件。运行： ``` $ npx gulp server ``` 然后您可以打开： + http://localhost:8888/web/viewer.html 请记住，这里假定使用的是最新版本的 Mozilla Firefox；有关 PDF.js 库的非开发用途，请参阅[构建 PDF.js](https://github.com/mozilla/pdf.js/blob/master/README.md#building-pdfjs)。 您也可以通过打开以下链接，在右侧查看所有测试 PDF 文件： + http://localhost:8888/test/pdfs/?frame ## 构建 PDF.js 为了将所有 `src/` 文件打包成两个生产脚本并构建通用 查看器，请运行： ``` $ npx gulp generic ``` 如果您需要支持旧版浏览器，请运行： ``` $ npx gulp generic-legacy ``` 这将在 `build/generic/build/` 目录中生成 `pdf.js` 和 `pdf.worker.js`（分别在 `build/generic-legacy/build/` 目录中）。 这两个脚本都是必需的，但只需要包含 `pdf.js`，因为 `pdf.worker.js` 将 由 `pdf.js` 加载。PDF.js 文件很大，在生产环境中应该进行压缩。 ## 代码覆盖率 我们在 [Codecov](https://codecov.io/gh/mozilla/pdf.js) 上跟踪测试套件覆盖了多少代码 （参见此文件顶部的徽章）。 ### 如何收集 启用覆盖率后，构建过程会使用 [`babel-plugin-istanbul`](https://github.com/istanbuljs/babel-plugin-istanbul) 对打包代码进行插桩， 它会添加计数器来记录运行的每一行、分支和函数： + 对于基于浏览器的测试（单元、集成和参考测试），插桩 代码在浏览器中运行，填充全局 `window.__coverage__` 对象，测试运行器从每个浏览器会话中收集它，合并 结果，并写入报告。 + 对于基于 Node 的单元测试（`unittestcli`），原始数据 写入到 `build/tmp/unittestcli-coverage.json` 并随后转换为报告。 ### 在本地收集覆盖率 将 `--coverage` 标志添加到任何测试任务中，例如： ``` $ npx gulp unittest --coverage # browser unit tests $ npx gulp unittestcli --coverage # Node unit tests $ npx gulp integrationtest --coverage # Puppeteer integration tests $ npx gulp botbrowsertest --coverage # reference tests ``` 以下选项控制输出： | 选项 | 描述 | 默认值 | | --- | --- | --- | | `--coverage` | 启用覆盖率收集。 | off | | `--coverage-output ` | 写入报告的目录。 | `build/coverage` | | `--coverage-formats ` | 以逗号分隔的格式列表：`info`、`html`、`json`、`text`、`cobertura`、`clover`。 | `info` | | `--coverage-per-test` | 同时构建每个测试的索引（见下文）。 | off | 默认情况下，报告以 `info` 格式写入 `build/coverage`，即 一个 [LCOV](https://github.com/linux-test-project/lcov) `lcov.info` 文件（与 上传到 Codecov 的格式相同）。使用 `--coverage-formats html` 来获取 可浏览的 HTML 报告，或者一次传递多种格式，例如 `--coverage-formats info,html`。 ### 查找哪些测试覆盖了特定行 使用 `--coverage-per-test` 运行浏览器测试任务，以在覆盖率目录中构建索引 （`per-test-index.json`），然后查询它以列出 执行了特定源代码行或函数的测试： ``` $ npx gulp botbrowsertest --coverage-per-test $ npx gulp coverage_search --code="canvas.js::205" $ npx gulp coverage_search --code="canvas.js::drawImageAtIntegerCoords" ``` ### 持续集成 在每次推送和 pull request 时，三个 GitHub Actions 工作流会收集覆盖率 并将其上传到 Codecov，每个工作流都标有各自的 Codecov *flag*，以便可以 区分测试类型： | 工作流 | 任务 | Codecov flag | | --- | --- | --- | | `unit_tests.yml` | `unittest` | `unittest` | | `integration_tests.yml` | `integrationtest` | `integrationtest` | | `coverage_browser_tests.yml` | `botbrowsertest` | `browsertest` | ## 在 Web 应用程序中使用 PDF.js 要在 Web 应用程序中使用 PDF.js，您可以选择使用预构建的库版本 或从源代码构建。我们在 NPM 上提供了预构建的版本，名称为 `pdfjs-dist`。有关更多信息和示例，请参阅 关于此主题的 [wiki 页面](https://github.com/mozilla/pdf.js/wiki/Setup-pdf.js-in-a-website)。 ## 通过 CDN 引入 PDF.js 托管在几个免费的 CDN 上： - https://www.jsdelivr.com/package/npm/pdfjs-dist - https://cdnjs.com/libraries/pdf.js - https://unpkg.com/pdfjs-dist/ ## 学习 您可以使用下面的在线演示直接在浏览器中体验 PDF.js API： + [交互式示例](https://mozilla.github.io/pdf.js/examples/index.html#interactive-examples) 更多示例可以在[示例文件夹](https://github.com/mozilla/pdf.js/tree/master/examples/)中找到。其中一些使用了 `pdfjs-dist` 包，可以通过 `npx gulp dist-install` 命令在此仓库目录中构建和安装该包。 有关 PDF.js 代码的介绍，请查看我们的 贡献者 Julian Viereck 的演讲： + https://www.youtube.com/watch?v=Iv15UY-4Fg8 更多学习资源请访问： + https://github.com/mozilla/pdf.js/wiki/Additional-Learning-Resources API 文档可在以下网址找到： + https://mozilla.github.io/pdf.js/api/ ## 问题 查看我们的常见问题解答并获得常见问题的解答： + https://github.com/mozilla/pdf.js/wiki/Frequently-Asked-Questions 在 Matrix 上与我们交流： + https://chat.mozilla.org/#/room/#pdfjs:mozilla.org 提交 issue： + https://github.com/mozilla/pdf.js/issues/new/choose

标签：CMS安全, JavaScript, MITM代理, PDF阅读器, 数据可视化, 文档解析, 浏览器扩展, 自定义脚本