gwt - 带有 GWT 应用程序的 PDF.js 不起作用

Question

我们有一个基于 GWT 框架构建的应用程序，我们希望在其中显示 PDF 文件而无需任何浏览器插件，目前正在评估 PDF.js 来实现这一点。问题是，无论我做什么，我都无法在我们的 GWT 应用程序中将 PDF 文件渲染到 Canvas 上。请提供一些背景

1. 从服务器检索 PDF 文件票证。

2. 使用此脚本从服务器检索 PDF.js 文件票证并将其嵌入到 HTML 正文中

   var head= document.getElementsByTagName('body')[0];
   var script= document.createElement('script');
   script.type= 'text/javascript';
   script.setAttribute('charset', 'UTF-8');
   script.src=url;
   head.appendChild(script);
   

3. 在 View 中创建 Canvas 元素(此处使用 googles MVP 模式)并使用上述函数对将 PDF.js 嵌入 HTML 主体的脚本进行 JSNI 调用。然后脚本调用与 PDF.js 文件中定义的 PDFJS 类一起工作的函数。

4. 在canvas上渲染PDF文件的函数如下:

   PDFJS.disableWorker = true; 
   PDFJS.getDocument(url).then(function getPdfHelloWorld(pdf) 
   {
       pdf.getPage(1).then(function getPageHelloWorld(page) 
       {
           var scale = 1.25;        
           var viewport = page.getViewport(scale);
           canvas.height = viewport.height;
           canvas.width = viewport.width;
           page.render({canvasContext: context, viewport: viewport});
           page.startRendering(context);
           alert("Finished rendering");  
       });
   });
   

5. Canvas 和上下文在 View 类中创建并传递给 javascript。

这里的问题是，在调用 JSNI 之后，我会显示所有变量的警报。浏览器显示警报，除非我发出调用警报(PDFJS)。这表明脚本中未识别 PDFJS 变量。这让我觉得 PDF.js 文件没有正确嵌入 View 中，或者我还缺少其他东西。

注意:我已经从网上下载了大部分示例，其中大部分都在本地运行，即我可以修改 PDF.js 文件路径以获取本地副本，HTML 仍然呈现 PDF。读取 PDFJS 变量没有问题。我只是在这个 GWT 应用程序中看到了这些问题。

有没有人知道发生了什么事。非常感谢您的帮助。

谢谢

Answer 1

您的问题是您正在注入(inject)脚本，因此它会异步加载，但您不会等到它加载后才开始使用它。

尝试使用 ScriptInjector.FromUrl注入(inject)脚本并将其余代码放入 Callback 的 onSuccess。

同步注入(inject)脚本(通过将它添加到您的 HTML 主机页面，或 GWT 模块描述符——注意:不会与 xsiframe 链接器一起工作——)，正如 Ilya 所建议的那样当然也是一个解决方案。