pdf.js 相关问题

是否可以创建PDFjs的Web组件

我们正在 MAUI-Blazor 应用程序中开发带有 PDF 查看器的文件浏览器。我们需要一个开源或免费的 PDF 查看器，因为我们还没有盈利。我们的要求是： 进口能力和

自定义 pdf.js

我想在我的web应用程序中使用pdf.js并自定义它的视图，这样我就可以将它嵌入到我的应用程序的其余部分中（我正在考虑使用iframe）。 一开始我想摆脱...

如何使 pdf.js 渲染上的文本可选择？

所以，我在模态中有一个 PDF，它是用 PDF.js 渲染的，我的主要目标是从渲染的 pdf 中选择文本并将其提取到控制台中，但是我的第一个问题是由于制作 t.. .

为什么 pdf.js 渲染无法工作并打开模型？

所以基本上，我有这个网络应用程序，它应该获取用户输入的 PDF，嵌入它并允许用户从嵌入的 pdf 中选择文本并将其记录到控制台。 然而，

PDF.js - 如何获取每个字符的信息而不是文本块的信息？

通过使用 PDF.js 可以获取每个文本块的信息，如下所示，但一些空格分隔的字符被错误地处理为一个块。我想要处理的 pdf 使用等宽字体，因此它很方便...

Pdf.js 与 React 和 django

我正在尝试使用 React.js 作为前端，使用 Django 框架开发一个 pdf 查看器 问题是 pdfviewer 在 React 项目上完美运行，但是当我构建它（npm run build）和 cop 时......

PDFJS：无效的 PDF 结构

我正在尝试使用 pdf.js 从 pdf 文档中提取纯文本，但由于某种原因，我无法克服无效的 PDF 结构错误。 我的代码是这样的： const pdfjslib = require('pdfjs-

Cordova IOS 应用程序 - 使用 PDFJS 打开从应用程序沙箱下载的 PDF

我正在开发一个非常旧的基于 Cordova 的混合 IOS 应用程序，它使用 PDFJS 库来渲染 PDF（用户手册）。 Cordova 版本是 6.1，我们没有使用任何 SPA 框架，如 AngularJS 或 React....

Javascript：从 PDF 中提取选定的文本到 JavaScript 中的输入文本框

我正在开发一个项目，其中应将选定的 PDF 文本复制到光标所在的输入文本框。 有2个窗户。 1：输入文本框在哪里 2：PDF 是...

我如何使用 pdfjs-dist 和 Angular 修复此错误消息？

在收到此错误消息后，我在项目 Angular 中安装 pdfjs-lib 以将 PDF 转换为画布： 错误：./node_modules/pdfjs-dist/build/pdf.js 2094:26 模块解析失败：意外的标记 (2094:26...

使用javascript从pdf中获取元数据

你好我想做的是从 PDF 文件获取元数据并使用 pdf-lib 库修改它 我按照文档中的方式尝试了这个 但我给了我 PDFDocument 未定义 我尝试过这个，因为我...

PDF.js：文件来源与查看者的不匹配

我正在尝试在浏览器中使用 PDF.js 从 Amazon-S3 上的存储桶提供 PDF 文件。我在S3中修改了相关的CORS政策。但是，我在兄弟中收到以下错误消息...

顶级等待实验未启用

我将 pdfjs 与 Angular 14 一起使用 当我尝试使用其中一个功能时，它给了我错误：顶级等待实验未启用： 导入 { Component、ElementRef、Input、OnInit、ViewChild }...

如何在 Scribd 等网站上显示和保护 PDF（不可直接下载）

我希望在我的网站上实现一项类似于 Scribd 为 PDF 文档提供的功能。目标是允许用户在 PDF 中查看和搜索，但阻止他们直接下载...

vue3使用pdf.js但显示异常

我是在https://mozilla.github.io/pdf.js/下载到本地的，版本是最新的，然后解压到项目的public文件夹下，使用的示例代码如下 输入图像描述...

如何使用pdf.js lib来填写xfa pdf表格？

我终于找到了一个可以打开和阅读xfa表单的lib(pdf.js)。但是我无法填写字段、保存它们并下载新的 pdf。 有人有关于如何做到这一点的例子吗？ 塔克斯 特...

如何检测页面何时已使用 PDFJS 渲染？

一旦 PDF.JS 完成渲染每个页面，我想对该页面的内容进行查找/替换。 我通过将以下内容放入 iFrame 的文档中来调用 PDF.JS： 菲...</desc> <question vote="3"> <p>一旦 PDF.JS <strong>完成渲染</strong>每个页面，我想<strong>然后</strong>对该页面的内容进行查找/替换。</p> <p>我通过将以下内容放入 iFrame 的文档中来调用 PDF.JS：</p> <pre><code>&lt;script&gt; fileId=0; function getURLParameter(name) { return decodeURIComponent((new RegExp(&#39;[?|&amp;]&#39; + name + &#39;=&#39; + &#39;([^&amp;;]+?)(&amp;|#|;|$)&#39;).exec(location.search)||[,&#34;&#34;])[1].replace(/\+/g, &#39;%20&#39;))||null } var fileId = getURLParameter(&#34;fileId&#34;); var DEFAULT_URL = &#39;/viewer/fetchpdf.php?fileId=&#39;+fileId; &lt;/script&gt; </code></pre> <p>然后从父框架设置 URL：</p> <pre><code>url = &#39;/_third_party/pdfjs/web/viewer.html?fileId=&#39;+$(this).attr(&#39;href&#39;); $(&#34;#iframeViewPdf&#34;).attr(&#39;src&#39;, url); </code></pre> <p>我注意到，当使用 PDF.JS 渲染 PDF 时，它会使用加载占位符初始化每个页面：</p> <pre><code>&lt;div id=&#34;pageContainer3&#34; class=&#34;page&#34; style=&#34;width: 991px; height: 1319px;&#34;&gt; &lt;div class=&#34;loadingIcon&#34;&gt;&lt;/div&gt; &lt;/div&gt; &lt;div id=&#34;pageContainer4... </code></pre> <p>然后将 PDF 呈现为 html，例如</p> <pre><code>&lt;div id=&#34;pageContainer3&#34; class=&#34;page&#34; style=&#34;width: 991px; height: 1319px;&#34;&gt; &lt;div class=&#34;canvasWrapper&#34; style=&#34;width: 991px; height: 1319px;&#34;&gt; &lt;canvas id=&#34;page46&#34; width=&#34;991&#34; height=&#34;1319&#34; style=&#34;width: 991px; height: 1319px;&#34;&gt; &lt;/canvas&gt; &lt;/div&gt; &lt;div class=&#34;textLayer&#34; style=&#34;width: 991px; height: 1319px;&#34;&gt; ... &lt;/div&gt; &lt;/div&gt; &lt;div id=&#34;pageContainer4... </code></pre> </question> <answer tick="false" vote="1"> <p>随着澄清，这是一个非常不同的故事。您没有直接使用 PDF.JS，而是使用它们的 Web 包装器。我认为你可以使用的一件事（我从来没有这样做过，现在只是阅读代码）是他们在 <pre><code>pageRendered</code></pre> 上发出 <pre><code>document</code></pre> 事件，所以如果你可以向它添加一个监听器，你应该没问题：</p> <pre><code>var frameDoc = document.getElementById(&#39;iframeViewPdf&#39;).contentWindow.document; frameDoc.addEventListener(&#39;pagerendered&#39;, function (evt) { console.log(evt); // see what goodies hide here! like page number etc } </code></pre> <p>（未测试，可能需要调整。）</p> </answer> <answer tick="false" vote="1"> <p>这就是我们检测页面渲染的方式。在设置监听器之前等待 iframe 内容加载很重要。</p> <pre><code>$( &#34;#iframeViewPdf&#34; ).load(function() { // wait for iframe to load var frameDoc = $(&#34;#iframeViewPdf&#34;).contents()[0]; frameDoc.addEventListener(&#34;pagerendered&#34;, function (evt) { console.log(evt.detail); }); }); </code></pre> </answer> <answer tick="false" vote="0"> <pre><code>//Step 1: store a refer to the renderer var pageRendering = page.render(renderContext); //Step : hook into the pdf render complete event var completeCallback = pageRendering.internalRenderTask.callback; pageRendering.internalRenderTask.callback = function (error) { //Step 2: what you want to do before calling the complete method completeCallback.call(this, error); //Step 3: do some more stuff }; </code></pre> </answer> </body></html>

PDF.JS - 检测页面何时呈现

一旦 PDF.JS 完成渲染每个页面，我想对该页面的内容进行查找/替换。 我通过将以下内容放入 iFrame 的文档中来调用 PDF.JS： 菲...</desc> <question vote="3"> <p>一旦 PDF.JS <strong>完成渲染</strong>每个页面，我想<strong>然后</strong>对该页面的内容进行查找/替换。</p> <p>我通过将以下内容放入 iFrame 的文档中来调用 PDF.JS：</p> <pre><code>&lt;script&gt; fileId=0; function getURLParameter(name) { return decodeURIComponent((new RegExp(&#39;[?|&amp;]&#39; + name + &#39;=&#39; + &#39;([^&amp;;]+?)(&amp;|#|;|$)&#39;).exec(location.search)||[,&#34;&#34;])[1].replace(/\+/g, &#39;%20&#39;))||null } var fileId = getURLParameter(&#34;fileId&#34;); var DEFAULT_URL = &#39;/viewer/fetchpdf.php?fileId=&#39;+fileId; &lt;/script&gt; </code></pre> <p>然后从父框架设置 URL：</p> <pre><code>url = &#39;/_third_party/pdfjs/web/viewer.html?fileId=&#39;+$(this).attr(&#39;href&#39;); $(&#34;#iframeViewPdf&#34;).attr(&#39;src&#39;, url); </code></pre> <p>我注意到，当使用 PDF.JS 渲染 PDF 时，它会使用加载占位符初始化每个页面：</p> <pre><code>&lt;div id=&#34;pageContainer3&#34; class=&#34;page&#34; style=&#34;width: 991px; height: 1319px;&#34;&gt; &lt;div class=&#34;loadingIcon&#34;&gt;&lt;/div&gt; &lt;/div&gt; &lt;div id=&#34;pageContainer4... </code></pre> <p>然后将 PDF 呈现为 html，例如</p> <pre><code>&lt;div id=&#34;pageContainer3&#34; class=&#34;page&#34; style=&#34;width: 991px; height: 1319px;&#34;&gt; &lt;div class=&#34;canvasWrapper&#34; style=&#34;width: 991px; height: 1319px;&#34;&gt; &lt;canvas id=&#34;page46&#34; width=&#34;991&#34; height=&#34;1319&#34; style=&#34;width: 991px; height: 1319px;&#34;&gt; &lt;/canvas&gt; &lt;/div&gt; &lt;div class=&#34;textLayer&#34; style=&#34;width: 991px; height: 1319px;&#34;&gt; ... &lt;/div&gt; &lt;/div&gt; &lt;div id=&#34;pageContainer4... </code></pre> </question> <answer tick="false" vote="1"> <p>随着澄清，这是一个非常不同的故事。您没有直接使用 PDF.JS，而是使用它们的 Web 包装器。我认为你可以使用的一件事（我从来没有这样做过，现在只是阅读代码）是他们在 <pre><code>pageRendered</code></pre> 上发出 <pre><code>document</code></pre> 事件，所以如果你可以向它添加一个监听器，你应该没问题：</p> <pre><code>var frameDoc = document.getElementById(&#39;iframeViewPdf&#39;).contentWindow.document; frameDoc.addEventListener(&#39;pagerendered&#39;, function (evt) { console.log(evt); // see what goodies hide here! like page number etc } </code></pre> <p>（未测试，可能需要调整。）</p> </answer> <answer tick="false" vote="1"> <p>这就是我们检测页面渲染的方式。在设置监听器之前等待 iframe 内容加载很重要。</p> <pre><code>$( &#34;#iframeViewPdf&#34; ).load(function() { // wait for iframe to load var frameDoc = $(&#34;#iframeViewPdf&#34;).contents()[0]; frameDoc.addEventListener(&#34;pagerendered&#34;, function (evt) { console.log(evt.detail); }); }); </code></pre> </answer> <answer tick="false" vote="0"> <pre><code>//Step 1: store a refer to the renderer var pageRendering = page.render(renderContext); //Step : hook into the pdf render complete event var completeCallback = pageRendering.internalRenderTask.callback; pageRendering.internalRenderTask.callback = function (error) { //Step 2: what you want to do before calling the complete method completeCallback.call(this, error); //Step 3: do some more stuff }; </code></pre> </answer> </body></html>

在nodejs应用程序中使用“pdfjs-dist”（pdfjs）包提取PDF文档时空间得到修剪

在将 pdf 文档提取为文本时，我遇到了一个问题，它删除了多余的空间并转换为单个空间附加了 pdf 文档图像以供参考 - 在此处输入图像描述。 PDF 达...

检测 pdf.js 上的放大和缩小

我想检测用户何时放大或缩小在 iframe 上使用 pdf.js 库打开的文档。我几乎在下面的代码中寻找术语“whatGoesHere”。