兄弟们，夜深人静，唯有我们这些苦逼的程序员还在敲键盘。我是一个普通的前端小菜鸡，在上周我遭遇了一个不小的挑战：客户希望将他们的excel文件原样的在网页中打印出来。这本是日常办公中的常见需求，但在Web开发领域却成了我的拦路虎。尝试了各种方法，依然无法解决这个棘手的问题，眼看时间一分一秒流逝，我几乎陷入了绝望。
就在我即将向困难低头，准备与枕头共度余下长夜时，发现了这款神奇的npm包——office-print。这款工具仿佛黑夜中的一道曙光，照亮了我前行的道路。
一、初识 office-print
office-print是一款专为网页环境设计的轻量级JavaScript库，其独特之处在于能够无缝集成到网页应用中，实现在浏览器端直接打印包括Excel、Word、PowerPoint、PDF甚至图片在内的多种文件格式。无需复杂的服务器后端支持，只需几行简单的代码调用，即可轻松解决困扰我已久的难题。
安装步骤极其简单，无论你习惯使用npm还是yarn，都能快速引入项目：
Bash
# npm方式安装
npm install office-print --save
# 或者使用yarn
yarn add office-print --save
二、实战演示：office-print 的魔法时刻
（1）打印网络资源
Javascript
const OfficePrint = require('office-print');
let fileUrl = 'your network excel url'; // 这里填你要打印的excel文件的url地址
fetch(fileUrl).then(response => response.arrayBuffer()).then(arrayBuffer => {
let file = new File([arrayBuffer], filename);
const officePrint = new OfficePrint();
officePrint.print(file);
});
仅需通过fetch获取网络文件并转换为ArrayBuffer，随后创建File对象并传递给office-print，瞬间完成远程文档的打印任务。
（2）打印本地上传文件
Html
<input type="file" id="input">
Javascript
const inputElement = document.getElementById("input");
inputElement.addEventListener("change", handleFiles, false);
function handleFiles() {
const fileList = this.files; // 获取选中的文件列表
fileList.forEach(file => {
const officePrint = new OfficePrint();
officePrint.print(file);
});
}
在页面添加文件输入控件，当用户选择文件后，利用office-print就能实时打印出用户选取的任何本地文件。
（3）直接打印已知路径的本地文件
Javascript
const OfficePrint = require('office-print');
let fileUrl = 'your local file system excel url';
const officePrint = new OfficePrint();
officePrint.printFile(fileUrl);
对于已知路径的本地文件，无需用户上传，直接指定文件路径，一键触发打印操作。
结语
office-print以其简洁优雅的设计、强大的功能和便捷的使用体验，不仅解决了实际项目中的痛点，更让身为程序员的我感受到了久违的技术乐趣和成就感。
如果你也曾为类似的需求烦恼过，或是正在寻找一款可靠且易于使用的网页打印解决方案，那么请务必试试office-print。相信它会成为你的得力助手，让你在Web开发的世界里如虎添翼。
原文链接：https://juejin.cn/post/7323142671761309737 作者：hinjin881
