在electron项目中预览和保存PDF通常是在main.js里使用如下方法:
ipc.on("export-pdf", async (_event, obj) => {
let pdfWindow = new BrowserWindow({
webPreferences: {
nodeIntegration: true,
webSecurity: false,
enableRemoteModule: true,
},
show: false, // 是否显示窗口
width: 800,
height: 600,
fullscreenable: true,
minimizable: false,
});
pdfWindow.loadURL(`data:text/html;charset=utf-8,${encodeURI(obj.html)}`);
pdfWindow.webContents.on("did-finish-load", () => {
const pdfPath = obj.filePath;
pdfWindow.webContents
.printToPDF({
printBackground: true,
})
.then((data) => {
fs.writeFile(pdfPath, data, (error) => {
if (error) throw error;
pdfWindow.close(); // 保存pdf过后关闭该窗口
pdfWindow = null;
win.webContents.send("export-pdf-reply", "success");
});
})
.catch((error) => {
console.log(error);
win.webContents.send("export-pdf-reply", "fail");
});
});
但浏览器对链接长度有限制,当用户的链接过长,就会导致解析失败。
解决办法是先将内容写入临时文件
async createTempFile(content) {
let that = this;
return new Promise((resolve, reject) => {
let tempPath = ""; // 你的临时文件目录
const fileName = `${Date.now()}.html`; // 使用当前时间戳作为文件名
const filePath = pathf.join(tempPath, fileName);
// 写入内容到临时文件
fs.writeFile(filePath, content, (err) => {
if (err) {
that.downFail();
return;
}
console.log("HTML file has been saved.");
});
resolve(filePath);
});
},
接着将main.js里的loadUrl替换为loadFile方法,地址为你的临时文件就可以正常预览下载了
ipc.on("export-pdf", async (_event, obj) => {
let pdfWindow = new BrowserWindow({
webPreferences: {
nodeIntegration: true,
webSecurity: false,
enableRemoteModule: true,
},
show: false, // 是否显示窗口
width: 800,
height: 600,
fullscreenable: true,
minimizable: false,
});
pdfWindow.loadFile(path.join(obj.path));
下载完建议把临时文件删除
fs.unlink(pdfPath, (err) => {
if (err) throw err;
console.log("临时文件已被删除");
});