1、前言:javascript
有时咱们想在一篇word文档中的指定位置添加一张服务器上的图片,而且而且设置图片大小。这个对文档的操做必定是须要第三方api的。市面上对文档处理的插件有POI以及openoffice等等,学习成本很大,关键是经过这些插件对文档的操做功能也是十分有限。html
因此咱们今天就要介绍一个中间件技术——pageoffice,此中间件技术已经将 在web系统操做office文档的大部分功能整合完毕,你们只须要关注本身web系统的业务逻辑便可,学习成本低,且功能很丰富。下面咱们来实战将pageoffice集成一下java
2、核心代码jquery
插入图片的代码web
DataRegion dataRegion = worddoc.openDataRegion("PO_开头的书签名称");
dataRegion.setValue("[image]doc/1.jpg[/image]");编程
插入图片并设置图片大小的代码api
data1.setValue("[image width=500.2 height=200]doc/1.jpg[/image]");服务器
注意:500.2单位是磅less
具体实现过程jsp
1.官网http://www.zhuozhengsoft.com/dowm/下载集成文件,引入jar包,配置web.xml
写a标签以前先引入pageoffice须要的js文件(js文件的路径是项目的根目录下)
<script type="text/javascript" src="/jquery.min.js"></script> <script type="text/javascript" src="/pageoffice.js" id="po_js_main"></script>
而后添加a标签
<a href="javascript:POBrowser.openWindowModeless('Word.jsp' , 'width=1200px;height=800px;');">打开文件</a>
<%@ page language="java" import="java.util.*,com.zhuozhengsoft.pageoffice.*,com.zhuozhengsoft.pageoffice.wordwriter.*" pageEncoding="utf-8"%> <% //******************************卓正PageOffice组件的使用******************************* PageOfficeCtrl poCtrl1 = new PageOfficeCtrl(request); poCtrl1.setServerPage(request.getContextPath()+"/poserver.zz"); //此行必须 WordDocument worddoc = new WordDocument(); //先在要插入word文件的位置手动插入书签,书签必须以“PO_”为前缀 //给DataRegion赋值,值的形式为:"[word]word文件路径[/word]、[excel]excel文件路径[/excel]、[image]图片路径[/image]" DataRegion data1 = worddoc.openDataRegion("PO_p1"); data1.setValue("[image width=100 height=100 ]doc/1.jpg[/image]"); poCtrl1.setWriter(worddoc); poCtrl1.setCaption("演示:后台编程插入图片到数据区域并设置图片大小(企业版)"); poCtrl1.webOpen("doc/test.doc", OpenModeType.docNormalEdit, "张三"); %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>演示:后台编程插入图片到数据区域(专业版、企业版)</title> </head> <body> <form id="form1" style="height: 100%;"> <div style="height: 700px; width: auto;"> <!--************** PageOffice 客户端代码开始 ************************--> <%=poCtrl1.getHtmlCode("PageOfficeCtrl1")%> <!--************** PageOffice 客户端代码结束 ************************--> </div> </form> </body> </html>
最终的效果
(1)设置图片大小为 宽高都为100 的时候
(2)图片大小宽高都为500的时候
启动项目直接访问.此时会提示安装插件,点击安装成功后提示注册,填写相关信息,填写注册码 I7TGD-71VV-FYD8-4NMYP 就能够打开文档.
注意设置图片大小的功能只有企业版才能支持。