另存文件为HTML格式

• 查看本示例演示效果（Windows版）
• 查看本示例演示效果（国产版）
• 本示例关键代码的编写位置，请参考“开始 - 快速上手”里您所使用的开发语言框架的最简集成代码

注意

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

在实际项目开发中，有时需要满足一些没有安装Office软件的客户端电脑或者手机端浏览文档的需求。为了实现这个功能，我们可以将Office文件另存为HTML格式。

在前端代码中，我们可以添加一个自定义按钮，并调用PageOffice控件的WebSaveAsHTML方法来实现。当用户点击“另存为HTML”按钮后，会在doc/test.docx所在的文件夹中生成一个test.html文件以及一个与test.html相关联的文件夹。

需要注意的是，这种方法虽然能够实现Office文件的浏览，但是它并不能完全替代Office软件的功能，因为在转换为HTML格式后，文件的一些高级特性可能会丢失或变得不够完美。因此，在选择此方法时，需要根据实际情况权衡利弊。

后端代码

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

PageOfficeCtrl poCtrl = new PageOfficeCtrl(request);
//webOpen的第一个参数支持能够输出下载文件的Url相对地址或者文件在服务器上的磁盘路径两种方式
//查看详细，请在本站搜索“PageOffice属性或方法中涉及到的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

注意

对PageOfficeCtrl对象的所有属性赋值或函数调用都必须在WebOpen方法调用之前执行，否则会不生效。

2. 在客户端js代码pageofficectrl.SaveFilePage属性指向的后端地址接口中，创建FileSaver对象处理文件的保存工作。

FileSaver fs = new FileSaver(request, response);
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;
fs.SaveToFile(webRootPath + "/SaveAsHTML/doc/" + fs.FileName);
return fs.Close();

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

前端代码

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

OnPageOfficeCtrlInit() {
  // PageOffice的初始化事件回调函数
  pageofficectrl.AddCustomToolButton("另存为HTML", "saveAsHTML()", 8);
}

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