NWJS实现页面打印和导出PDF功能的小结

1、实现页面内容的直接打印,跳过预览页面,代码如下:
var win = nw.Window.get();
win.print({printer: "HP LaserJet 1020",headerFooterEnabled:false});

(这里的print函数是nw经过包装的,可以传入打印参数进行打印,详情请参考相关文档,不同于DOM中的window.print函数)
参数中需要传入打印机名,如果没提供打印机名则会停在预览页面,手动选择打印机,再打印;
打印机名可通过win.getPrinters()读取,在返回的打印机数组中读取deviceName属性;
因为无法读取系统默认打印机名,所以可以生成一个select给用户选择然后保存起来。
// ==读取打印机信息
win.getPrinters(function(data){
var str="";
for (var i=0; i<data.length; i++){
str += "<option value='" + data[i].deviceName + "' >" + data[i].printerName + "</option>";
}
$("printer_selector").innerHTML = str;
var myPrinter = localStorage.getItem("myprinter");
if(!myPrinter){
alert("首次使用请先设置打印机!!!");
$('setting_box').showModal();
}else{
$("printer_selector").value = myPrinter;
}
});
[/i][/i]
//页面中设置打印机的对话框HTML
<dialog id="setting_box" class="noprint">
<p>打印机设置:<select id="printer_selector"></select></p>
<p><input type="button" value="保存" onclick="localStorage.setItem('myprinter',$('printer_selector').value);$('setting_box').close();"></p>
</dialog>


2、导出PDF,方法类似,参数需要传入pdf_path
win.print({pdf_path:"D:/file.pdf",headerFooterEnabled:false})

参数需要传入完整的pdf文件名,才会跳过预览界面,如果没有提供文件名则也会停在预览页面,需要手动 “另存为PDF”。
为了跳过那讨厌难看的预览界面,我们可使用nw中的另存文件对话框的功能;
1)首先做一个文件标签,注意加上nwsaveas属性,并隐藏起来(因为也很难看)
<input type="file" nwsaveas="savefile.pdf" id="savepath" onchange="printPage(true)" style="display:none;">
2)再做一个导出PDF的按钮,模拟点击文件标签
<input type="button" onclick="$('savepath').value='';$('savepath').click();">

3、因为都是用了win.print(),所以我们可以做在一个函数里面,打印和导出均执行这个函数即可
// 打印和导出PDF函数
function printPage(isPDF){
if(isPDF){
win.print({pdf_path:$("savepath").value,headerFooterEnabled:false});
}else{
win.print({printer:localStorage.getItem("myprinter"),headerFooterEnabled:false});
}
}
以上,打印和导出PDF功能基本实现,虽说是可以自动跳过预览界面,但过程中还是会闪过一下下;
代码可能有些凌乱请自行整理;希望对有相关需求的初学者有所帮助。
已邀请:

要回复问题请先登录注册