如何在电子浏览器窗口中查看PDF? [英] How to view a PDF in an Electron BrowserWindow?
问题描述
所以我有这个Electron应用程序，并且在一个.html文件中，我链接了另一个脚本，该脚本为该程序提供了一些实用功能，其中一个就是这个:
So I have this Electron app and in one of the .html-files I link another script that provides some utility-functions to the program and one of those is this one:
function openPDF(filePath){
let pdfWindow = new electron.remote.BrowserWindow({
icon: './build/icon.png',
width: 1200,
height: 800,
webPreferences: {
plugins: true
}
});
pdfWindow.loadURL(url.format({
pathname: filePath,
protocol: 'file:',
slashes: true
}));
pdfWindow.setMenu(null);
pdfWindow.on("closed", function () {
pdfWindow = null
});
}
因此，这应该使用集成的Electron PDF Viewer(使用Chromium)在新窗口中打开PDF.我使用了臭名昭著的plugins: true，我尝试了大多数
So this should use the integrated PDF-Viewer of Electron (which uses Chromium) to open the PDF in a new window. I used the infamous plugins: true, I tried through most of the thousands of preferences you can define for a BrowserWindow but it always opens the window and then starts to download the file instead of displaying it.
我三重检查了文件路径，导入"等，更新了所有内容，但似乎找不到问题.自 1.6.4 以来，Electron本身就支持此功能.对我来说.
I triple checked the file path, the "imports" etc., updated everything but I can't seem to find the problem. Electron natively supports this since 1.6.4 but it doesn't work for me.
帮我，堆栈溢出，您是我唯一的希望.
Help me, Stack Overflow, you are my only hope.
推荐答案
@karthick正确指出，这是一个尽管plugins: true仍然禁用了插件的错误. 问题存在
@karthick correctly pointed out that this is a bug that disables the plugins despite plugins: true. The Issue exists since 3.0.0 (September 18, 2018) and remains to be fixed today has finally been fixed in Version 10!
使用以下命令将电子版本更新为最新的10.X(当前仅作为夜间版本提供)以重新启用该功能:
Update your electron version to the latest 10.X (currently only available as a nightly release) with this command to re-enable the functionality:
npm install electron@nightly --save-dev
您可以在项目文件夹中的package.json中检查devDependencies.它应该看起来像这样:
You can check the devDependencies in the package.json which should be found in your project folder. It should look something like this:
"devDependencies": {
"electron": "nightly"
},
旧答案:
Old answer:
由于GitHub的持久性问题会变得相当混乱，因此我将根据开发的要点来更新此答案.您还可以在答案的末尾找到三种解决方法.
As long-lasting GitHub issues tend to get rather confusing I will update this answer with the gist of the development. You can also find three workarounds at the end of the answer.
更新:
- March 19th: A fix is on the way.
- May 19th: The fix mentioned above is currently on hold waiting for better extension support.
- June 28th: Better extension support is not expected to be there any time soon.
July 16th: The fix is no longer being actively worked on. Quote of the developer:
我试图移植到Chromium的查看器时遇到的主要问题是它对铬扩展系统的依赖性.电子仅支持该系统的一部分，这使得集成查看器变得很困难.
The main thing I ran into trying to port over Chromium's viewer was its dependency on the chromium extension system. Electron supports only a portion of that system which made it difficult to integrate the viewer.
7月25日:扩展支持的改进有了明显的进展已合并，并创建了跟进跟踪问题.这增加了继续进行修复程序的可能性.
July 25th: There has been significant progress with the improvement of the extension support which was merged and a follow-up tracking issue was created. This increased the likeliness of a continuation of the work on the fix.
8月28日:目前，没有人在研究修补程序.如果愿意，您可以在BountySource上悬赏此问题可以更快地解决此问题.
August 28th: Right now no one is working on a fix. You can put a bounty on this issue over on BountySource if you want to see this solved more quickly.
11月19日:修复程序已关闭，分支已删除.开发人员的报价:
November 19th: The fix was closed and the branch deleted. Quote of the developer:
我们仍然打算有一天恢复PDF查看器，但这要依靠我们首先迁移以使用Chrome的扩展程序库而不是我们自己的填充程序，因为Chromium中的PDF查看器是作为扩展程序实现的.
We're still intending to one day restore the PDF viewer, but it relies on us first migrating to use Chrome's extensions library instead of our own shim, as the PDF viewer in Chromium is implemented as an extension.
1月2日:尽管 a在BountySource上获得$ 1,600的赏金
1月21日:扩展支持不断得到改善(跟踪问题 )，并引入了新修复程序.
January 21st: Extension support is being improved continuously (tracking issue) and a new fix has been introduced.
2月13日:新修复程序已被合并，并且该问题已经被关了. 看起来这将在Electron 10中解决！开发者报价:
February 13th: The new fix has been merged and the issue has been closed. Looks like this is going to be resolved in Electron 10! Quote of the developer:
应该准备在接下来的10.x每晚进行测试.我希望也能移植到9.x，尽管如果它引起问题，它可能最终不会卡住.
This should be ready to test out in the next 10.x nightly. I'm hoping to backport to 9.x as well, though it may not end up sticking if it causes issues.
解决方法:
-
您可以通过降级到最新的2.X.X使其工作.为此，请使用以下命令:
You can make it work by downgrading to the latest 2.X.X. To do that use the following command:
npm install electron@"<3.0.0" --save-dev
但是请记住，仅最新的三个电子团队支持稳定的主要版本，这意味着 2.XX不再收到安全补丁.
Keep in mind, however, that only the latest three stable major versions are supported by the Electron team which means 2.X.X is not receiving security patches anymore.
或者，您可以调用系统来打开文件.它将选择分配给PDF的默认程序:
Alternatively you could call on the system to open the file. It will choose the default program assigned to PDFs:
shell.openItem(fullPath);
只需确保始终使用path.resolve(app.getAppPath(), filePath)之类的东西正确解析路径(fullPath)，因为在构建应用程序时它可能会更改.
Just make sure that the path (fullPath) is always correctly resolved with something like path.resolve(app.getAppPath(), filePath) as it might change when you build the app.
另一种解决方法是使用类似 PDF.js 之类的方法，虽然不能完全提供Chrome PDF Viewer的全部功能(例如缺少字段补全)，但对于大多数应用程序来说可能已经足够了.这是一个示例实现，捕获下载事件并将其路由到PDF.js-viewer:
Another workaround would be to use something like PDF.js which doesn't quite offer the full feature set of the Chrome PDF Viewer (e.g. missing field completion) but is probably good enough for most applications. Here is a sample implementation which catches the download-event and routes it to the PDF.js-viewer:
const { BrowserWindow, session } = require('electron')
session.defaultSession.on('will-download', (event, item, webContents) => {
if (item.getMimeType() === 'application/pdf' && item.getURL().indexOf('blob:file:') != 0) {
event.preventDefault();
new BrowserWindow().loadFile(path.resolve(__dirname, `pdfjs/web/viewer.html?file=${item.getURL()}`));
}
})
这篇关于如何在电子浏览器窗口中查看PDF?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
