Office文档在线预览方案

注意

本文中展示的代码均为关键代码，复制粘贴到您的项目中，按照实际的情况，例如文档路径，用户名等做适当修改即可使用。

在涉及到Office文档管理的各种Web项目中，时常会遇到用户阅读文档的时候，并不想将网站上的Office文档下载到本地，这时候就需要文档在线预览的功能。

目前常用的文档在线预览方案如下：

• 转换为HTML文件。转换后的HTML格式可以直接用浏览器查看，但是无法完全保留原Word文档的格式和功能。例如，HTML不支持某些Word功能，转换时Word可能会自动更改或取消内容，而且另存HTML格式还会导致文档的布局、字体样式等发生变化，影响文档的可读性和专业性。

• 调用第三方提供的在线预览接口。比如调用永中Office、金山文档、腾讯文档等在线预览服务，集成相对简单，开发工作量小，但是只能在公网环境使用，且对于超过一定大小的文件，预览速度会变得很慢，这意味着大文件的处理能力受限，可能会影响用户体验。在线预览文档需要先上传到第三方官方的服务器进行解析，然后下载到服务器中后实现在线预览，这种模式意味着对第三方服务的依赖，可能会因为第三方服务的问题而影响在线预览的稳定性和速度。但是如果Web系统中存储的是涉密文档，包含了技术秘密和经营秘密等商业秘密，甚至包含了国家机密，那么绝对不能使用第三方预览服务。

• 转换为PDF文件（推荐）。通过转换为PDF格式，可以确保在大多数浏览器和平台上都能实现良好的兼容性。PDF是一种广泛支持的文件格式，几乎所有的现代浏览器都内置了对PDF的支持，这意味着用户可以在没有额外软件的情况下直接预览文件。PDF格式的文件具有很好的跨平台性，无论是在Windows、MacOS还是Linux操作系统上，用户都可以方便地打开和查看PDF文件，这一点对于需要在不同操作系统间共享和查看文档的用户来说非常重要。

用PageOffice实现的Office文档在线预览采用了转换为PDF文件的预览方案，可以在公网环境使用，也可以支持物理隔绝的内网环境。

第一步： 使用PageOffice在线编辑Office文件，可以在每次保存文件的时候同另存一份PDF格式的文件，如此一来，PDF文件和Office文件的内容总是完全同步的。实现PageOffice在线编辑Office，保存文件的同时转pdf的关键代码如下。

• 后端代码：

1. 在后端编写代码调用webOpen方法打开文件之前给SaveFilePage属性赋值（设置好保存时由哪个地址接口负责接收处理控件上传的文件流）；

PageOfficeCtrl poCtrl = new PageOfficeCtrl(request);
//webOpen的第一个参数支持能够输出下载文件的Url相对地址或者文件在服务器上的磁盘路径两种方式
poCtrl.webOpen("doc/test.docx", OpenModeType.docNormalEdit, "张佚名"); // 打开文件

PageOfficeNetCore.PageOfficeCtrl poCtrl = new PageOfficeNetCore.PageOfficeCtrl(Request);
//webOpen的第一个参数支持能够输出下载文件的Url相对地址或者文件在服务器上的磁盘路径两种方式
poCtrl.WebOpen("doc/test.docx", PageOfficeNetCore.OpenModeType.docNormalEdit, "tom");

// Make sure to add code blocks to your code group

2. 在客户端js代码pageofficectrl.SaveFilePage属性指向的后端地址接口中，创建FileSaver对在线打开的Office文件和另存的pdf文件分别进行保存。

FileSaver fs = new FileSaver(request, response);
if(fs.getFileExtName().equals(".pdf")){
    fs.saveToFile(request.getSession().getServletContext().getRealPath("pdf/") + fs.getFileName());
}else{
    fs.saveToFile(request.getSession().getServletContext().getRealPath("doc/") + fs.getFileName());
}
fs.close();

PageOfficeNetCore.FileSaver fs = new PageOfficeNetCore.FileSaver(Request, Response);
await fs.LoadAsync();
string webRootPath = _webHostEnvironment.WebRootPath;
if(fs.FileExtName == ".pdf"){
  fs.SaveToFile(webRootPath + "/pdf/" + fs.FileName);
}else{
  fs.SaveToFile(webRootPath + "/doc/" + fs.FileName);
}
fs.Close();

// Make sure to add code blocks to your code group

• 前端代码：

使用AddCustomToolButton添加自定义保存按钮，实现保存文件的同时另存PDF。

function SaveFile() {
  //使用SaveFilePage属性设置后端保存方法的Controller路由地址，这个地址必须从"/"开始
  pageofficectrl.SaveFilePage = "/saveFile";
  pageofficectrl.WebSave(); //保存当前文件
  pageofficectrl.WebSaveAsPDF(); //另存当前文件为PDF格式
}

OnPageOfficeCtrlInit() {
  // PageOffice的初始化事件回调函数
  pageofficectrl.AddCustomToolButton("保存", "SaveFile()", 1);
}

// Make sure to add code blocks to your code group

第二步： 需要在线预览Office文档的环节，只需集成调用PageOffice的PDFCtrl组件在线打开PDF文件即可。如果还想实现只让用户浏览文件内容，不允许用户下载另存文件的功能，可以设置pdfCtrl对象的AllowCopy属性为false，禁止文件内容的拷贝操作，这样就能实现用户只能在线查看文件，而获取不到文件的下载地址，也无法另存PDF文件到本地，实现文件的安全浏览。

PDFCtrl pdfCtrl = new PDFCtrl(request);
pdfCtrl.setAllowCopy(false);//禁止拷贝
pdfCtrl.webOpen("D:\\documents\\test.pdf");
// Linux服务器添加前缀：file://
// pdfCtrl.webOpen("file://"+"/root/documents/test.pdf");

PageOfficeNetCore.PDFCtrl PdfCtrl = new PageOfficeNetCore.PDFCtrl(Request);
PdfCtrl.AllowCopy = false; //禁止拷贝
PdfCtrl.WebOpen("doc/test.pdf");

// Make sure to add code blocks to your code group

提示

PageOffice内置了PDF阅读器，所以即使客户端电脑未安装Office或WPS软件也可以在线打开PDF文件。