pageoffice vue引用_vue pageoffice - CSDN
精华内容
参与话题
  • PageOffice集成说明

    千次阅读 2018-09-14 09:53:33
    运行PageOffice产品的演示程序: 访问PageOffice官网:http://www.zhuozhengsoft.com/ ,下载PageOffice产品开发包; 解压PageOffice开发包,双击运行Setup.exe安装服务器组件; 双击 Samples4 目录下...

    运行PageOffice产品的演示程序:

    1. 访问PageOffice官网:http://www.zhuozhengsoft.com/ ,下载PageOffice产品开发包;

    2. 解压PageOffice开发包,双击运行Setup.exe安装服务器组件;

    3. 双击 Samples4 目录下的 Samples4.sln,即可运行示例查看效果。

    经过上面三个步骤,就可以把PageOffice产品的演示程序运行起来,在以后的开发过程中会经常需要参考Samples4示例,参考演示程序不但可以看到代码是如何编写的,还可以直观的看到对应功能所实现的效果。

    集成PageOffice到自己的工程项目里:

    1. 双击运行Setup.exe 安装服务器组件;
    2. 拷贝“集成文件”目录下的“pageoffice”文件夹到您自己网站的根目录下(请务必放到根目录下,且不要改名);
    3. 在aspx页面头部添加代码;
    <%@ Register Assembly="PageOffice, Version=4.0.0.1, Culture=neutral, PublicKeyToken=1d75ee5788809228"
        Namespace="PageOffice" TagPrefix="po" %>
    
    1. 在html代码的body中需要出现office界面的位置插入下面的代码:
    <div style="width:1000px; height: 700px;" >
        <po:PageOfficeCtrl ID="PageOfficeCtrl1" runat="server" ></po:PageOfficeCtrl>
    </div>
    
    1. 如果使用 PageOffice 的 POBrowser 方式打开文件,那么调用 javascript 方法“POBrowser.openWindow”的页面一定要引用下面的js文件
        <script type="text/javascript" src="pageoffice/js/jquery.min.js"></script> 
        <script type="text/javascript" src="pageoffice/js/pageoffice.js" id="po_js_main"></script> 
    

    注意: pageoffice.js文件的引用需要添加 id="po_js_main"

    展开全文
  • 一.用office online的官方接口 这种方法可以应用在门户网站上,而且对查看次数没有限制,主要原理为...api引用方法如下: let doad=document.getElementById("download"); doad.href=‘http://view.officeapps.live.c

    一.用office online的官方接口

    这种方法可以应用在门户网站上,而且对查看次数没有限制,主要原理为,微软从你的服务器下载文件,然后转换为显示在页面中的office文档,格式、样式都能得到保留。api引用方法如下:

    <a href="#" id="download"></a>
    let doad=document.getElementById("download");
    doad.href=‘http://view.officeapps.live.com/op/view.aspx?src=’+"你的地址"
    注意,这个地址必须为域名,不可为ip,否则无法提取。

    https://blogs.office.com/en-us/2013/04/10/office-web-viewer-view-office-documents-in-a-browser/


    二、Office文档直接转换为SWF,通过网页加载Flash预览

    利用flashpaper直接转换为SWF文件(虚拟打印机),然后利用flexpaper预览Flash文件。
    flashpaper是Macromedia的一款产品,随着被Adobe公司收购,Macromedia对于这款软件早就放弃了,国内尚无人在程序中调试成功过。
    参考链接:
    http://www.dzwebs.net/1149.html 


    三、office转Html、pdf转图片在线预览文件Html文件

    利用DCOM配置直接操作Office文件,读取文件内容,导出Html文件
    优点:
    实践证明此方法不科学。
    缺点:
    1、服务器上必须安装Office软件。
    2、配置麻烦,正如微软所说,读取Office不是这么干的。
    3、转换的文件格式均丢失。
    4、仅限于IIS服务器,利用ASP.net(C#)。
    参考链接:
    http://www.cnblogs.com/tangbinblog/archive/2012/11/29/2794110.html 


    四、第三方ActiveX浏览器控件

    如科瀚的SOAOffice中间件、卓正软件的pageoffice控件、WebOffice控件、国外的Office Viewer ActiveX Control
    优点:
    可在线编辑等。
    缺点:
    1、客户端需安装控件。
    2、付费。
    3、在Html5、CSS3以及桌面向浏览器转换的大潮流下,控件已是昨日黄花。
    参考链接:
    http://www.kehansoft.com/soaoffice/index.htm 
    http://www.zhuozhengsoft.com/ 
    http://www.officectrl.com/ 
    http://www.anydraw.com/ 


    五、微软的Office365

    微软新出的在线文档,与Google文档抗衡,估计没谷歌文档,微软也懒得出这个
    优点:
    微软自家的东西原生态呈现。
    缺点:
    文件大小限制在10M以内,10M以外的无法预览
    加载文件较多,各种图片、文字、样式、JQuery等,页面臃肿,加载速度慢,耗费流量,不适合手机预览
    需要微软的批量许可(即授权),硬件投入方面:架设一台单独的服务器(可以是虚拟机),配置过低能安装,但无法运行,另外还需一台域服务器。而这两台机器上均不能安装其它程序,比如SQLServer,在Office365服务器上每次重启IIS会重置,也就是说你不能有任何其它网站。其主要是用来与SharePoint搭配使用。
    参考链接:
    http://technet.microsoft.com/zh-cn/library/jj219456(v=office.15).aspx 


    六、第三方成熟的服务

    如OfficeWeb365
    优点:
    1、OfficeWeb365采用适合中文排版的纯Html、CSS技术。
    2、接口简单,适合PHP、JSP、ASP.net等所有的对接,省心省力。
    3、费用低廉,节省投入。
    4、不用关心客户端是否安装了Office软件,不用在客户端部署。
    5、手机在线预览2页Word文档只有3K大小,且格式保留,领先全球的中文在线预览技术。
    6、支持国产的金山WPS,这在国内尚属首列。
    7、其解析速度(100ms)与高并发的支持远远把对手甩在了后面。
    缺点:
    1、OfficeWeb365只能查看不能编辑,目前在线编辑版的正在开发。
    参考链接:
    http://www.officeweb365.com 


    七、在浏览器中直接打开

    通过设置MiME类型,告诉浏览器这是Office文件,浏览器直接调用本地Office或PDF软件打开
    优点:
    1、不用编程,不用第三方服务,直截了当。
    2、很多用户安装了Adobe的PDF预览软件,同时在浏览器上也直接安装了插件,浏览器可直接查看PDF文件。
    缺点
    你永远不知道客户机器上是否安装了Office软件,虽然几乎都安装了,但直接调用Office软件,客户体验大大下降,更何况还有个讨厌的迅雷一直在监视你的浏览器,不给你打开的机会,当然这些都是你无法预知的。



    展开全文
  • 1.因浏览器禁用插件无法使用内嵌在浏览器内部的...2.因pageoffice提供的示例全部是基于jsp的,所以无法放在vue中使用,所以我只能在后端使用thymleaf模板去做这件事情。 首先可以去pageoffice的官网的下载中心下...

    1.因浏览器禁用插件无法使用内嵌在浏览器内部的pageoffice打开方式,需要使用4.0新增的POBrowser方式来在外部打开一个窗口去在线打开office
    故下面介绍的是基于4.0在线打开文档的一种方式

    2.因pageoffice提供的示例全部是基于jsp的,所以无法放在vue中使用,所以我只能在后端使用thymleaf模板去做这件事情。

    首先可以去pageoffice的官网的下载中心下载最新版的office示例:

    下载最新版即可

    打开示例中的一个jsp文件如下:
    在这里插入图片描述

    JSP中这么写但是我们肯定是用的html不能这么写 我们首先在springboot
    pom.xml中引入thymleaf模板,具体设置可以百度

    在上面jsp中有黄色的 <% %> 的代码块很容易能看出来是后端的代码,我们要做的就是把这一块移到后台,和前面的页面分开。

    我们首先在配置文件中加入几个配置,代码如下:

    #########################################
    ####pageoffice
    #########################################
    #磁盘目录用来存放PageOffice注册成功之后生成的license.lic文件
    posyspath: d:/lic
    #设置PageOffice自带印章管理程序的登录密码
    popassword: 123456
    

    然后在后端的controller层创建一个pageofficeController,代码如下:

    /**
     * @author wj
     * @version 1.0
     * @className pageofficeController
     * @description pageoffice测试
     * @date 2019/11/07 8:30
     */
    @Controller
    public class pageofficeController {
        @Value("${posyspath}")
        private String poSysPath;
        @Value("${popassword}")
        private String poPassWord;
    
    
        /**
         * 添加PageOffice的服务器端授权程序Servlet(必须)
         *
         * @return
         */
        @Bean
        public ServletRegistrationBean servletRegistrationBean() {
            com.zhuozhengsoft.pageoffice.poserver.Server poserver = new com.zhuozhengsoft.pageoffice.poserver.Server();
            //设置PageOffice注册成功后,license.lic文件存放的目录
            poserver.setSysPath(poSysPath);
            ServletRegistrationBean srb = new ServletRegistrationBean(poserver);
            srb.addUrlMappings("/poserver.zz");
            srb.addUrlMappings("/posetup.exe");
            srb.addUrlMappings("/pageoffice.js");
            srb.addUrlMappings("/sealsetup.exe");
            return srb;
        }
    
        /**
         * 添加印章管理程序Servlet(可选)
         *
         * @return
         */
        @Bean
        public ServletRegistrationBean servletRegistrationBean2() {
            com.zhuozhengsoft.pageoffice.poserver.AdminSeal adminSeal = new com.zhuozhengsoft.pageoffice.poserver.AdminSeal();
            adminSeal.setAdminPassword(poPassWord);//设置印章管理员admin的登录密码
            //设置印章数据库文件poseal.db存放目录,该文件在当前demo的“集成文件”夹中
            adminSeal.setSysPath(poSysPath);
    
            ServletRegistrationBean srb = new ServletRegistrationBean(adminSeal);
            srb.addUrlMappings("/adminseal.zz");
            srb.addUrlMappings("/sealimage.zz");
            srb.addUrlMappings("/loginseal.zz");
            return srb;
        }
    
        /**
         * 查看word
         *
         * @param request
         * @param map
         * @return
         */
        @RequestMapping(value = "/word", method = RequestMethod.GET)
        public String showWord(HttpServletRequest request, Map<String, Object> map) {
            //--- PageOffice的调用代码 开始 -----
            PageOfficeCtrl poCtrl = new PageOfficeCtrl(request);
            poCtrl.setServerPage("/poserver.zz");//设置授权程序servlet
            poCtrl.webOpen("d:\\test.doc", OpenModeType.docAdmin, "张三");
            map.put("pageoffice", poCtrl.getHtmlCode("PageOfficeCtrl1"));
            //--- PageOffice的调用代码 结束 -----
    //        ModelAndView mv = new ModelAndView("Word");
            return "readword/Word";
        }
    
        @RequestMapping("/newword")
        public String tonewword() {
            return "readword/jump";
        }
    

    前端2个HTML放在一个readword文件夹下

    jump.html如下

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script type="text/javascript"  src="./jquery.min.js"></script>
        <script type="text/javascript"  src="./pageoffice.js" id="po_js_main"></script>
    </head >
    <body >
    <!--<a href="javascript: ">123123</a>-->
    
    </body >
    <script type="text/javascript">
        setTimeout(load,500);
        function load() {
            // 最新的打开方式,width和height为打开的最外部边框大小
            POBrowser.openWindowModeless('/word','width=1440px;height=860px');
        }
    </script>
    </html>
    

    Word.html如下:

    <!DOCTYPE html>
    <html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script type="text/javascript"  src="./jquery.min.js"></script>
    </head>
    <body>
    <div style="width:auto;height:790px;margin: 0 auto;" th:utext="${pageoffice}">
    </div>
    </body>
    <script type="text/javascript">
    </script>
    </html>
    

    最后附上我的项目层次结构:
    在这里插入图片描述

    前端调用pageoffice只需要调用接口“/newword”即可。

    以上为具体示例,如果有问题可加qq:1016400304

    展开全文
  • PageOffice使用实例

    千次阅读 2018-01-27 09:48:18
    一、web.xml添加配置 poserver com.zhuozhengsoft.pageoffice.poserver.Server poserver /poserver.zz poserver /sealsetup.exe poserver /posetup.exe .../pageoffice.js poser

    一、web.xml添加配置

    <!-- PageOffice Begin -->
    <servlet>
    <servlet-name>poserver</servlet-name>
    <servlet-class>com.zhuozhengsoft.pageoffice.poserver.Server</servlet-class>
    </servlet>
    <servlet-mapping>
    <servlet-name>poserver</servlet-name>
    <url-pattern>/poserver.zz</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
    <servlet-name>poserver</servlet-name>
    <url-pattern>/sealsetup.exe</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
    <servlet-name>poserver</servlet-name>
    <url-pattern>/posetup.exe</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
    <servlet-name>poserver</servlet-name>
    <url-pattern>/pageoffice.js</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
    <servlet-name>poserver</servlet-name>
    <url-pattern>/pobstyle.css</url-pattern>
    </servlet-mapping>
    <servlet>
    <servlet-name>adminseal</servlet-name>
    <servlet-class>com.zhuozhengsoft.pageoffice.poserver.AdminSeal</servlet-class>
    </servlet>
    <servlet-mapping>
    <servlet-name>adminseal</servlet-name>
    <url-pattern>/adminseal.zz</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
    <servlet-name>adminseal</servlet-name>
    <url-pattern>/loginseal.zz</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
    <servlet-name>adminseal</servlet-name>
    <url-pattern>/sealimage.zz</url-pattern>
    </servlet-mapping>
    <mime-mapping>
    <extension>mht</extension>
    <mime-type>message/rfc822</mime-type>
    </mime-mapping>
    <context-param>
    <param-name>adminseal-password</param-name>
    <param-value>111111</param-value>
    </context-param>
    <!-- PageOffice End -->

    二、引用jar


    三、项目中的路径使用

    一定要使用根路径,否则web.xml中配置的访问不到



    展开全文
  • pageoffice使用

    万次阅读 多人点赞 2016-09-26 17:44:44
    需要用到的jar包: pageoffice.jar 外部软件: office 2007 准备工作: 1.在xml下配置一个本地磁盘路径,作为保存新建的word保存的路径 D:\JAVA\kinggene\admin\workflow\wordTemp\form\doc\ //seq_word_path为配置...
  • 我下载的是PageOffice完整程序包(PageOffice 4.5 for JAVA ),打开以后有demo(Samples4文件夹),有jar包和web.xml的配置(集成文件),安装说明,开发文档。 其中,将Samples4放入Tomcat的webapps文件夹中,然....
  • 解决办法:去掉POBrowser打开文件的子页面对pageoffice.js的引用
  • Vue如何引入第三方js

    2019-02-28 13:38:31
    最近遇到的问题是如何在vue中引入mui.js,通过import引入就报这个错 一看就知道mui是传统模式,没有es6的export写法,所以import引用不到,给mui加上export default mui后,是没问题了,但是浏览器中又报错 这是...
  • WebOffice开发系列指南 WebOffice文档控件技术交流和版本发布 发表回复 17 篇帖子 • 分页: 1 / 2 • 1, 2 WebOffice开发系列指南 由 hangel » 2010-07-12 11:33 WebOffice开发系列01-自动下载安装...
  • 在electron中实现PDF的在线预览

    千次阅读 2019-04-16 16:04:21
    由于公司业务的开发需要,需要实现在electron上实现PDF的在线预览功能。electron 3.x版本后就不在支持PDF的预览功能了,官方给的解释是由于人手不够将不再支持PDF预览功能(也是醉了),在经过一番调研结合大佬们的...
  • Vue中引入配置CKEditor5

    千次阅读 2020-01-30 20:09:30
    1. 配置 vue.config.js 1.1 安装依赖项 npm install --save \ @ckeditor/ckeditor5-vue \ @ckeditor/ckeditor5-dev-webpack-plugin \ @ckeditor/ckeditor5-dev-utils \ postcss-loader@3 \ raw-loader@...
  • Stimulsoft_Report纯代码实现数据绑定

    千次阅读 2016-04-06 09:51:03
    一、前台代码: <%@ Page Title="" Language="C#" MasterPageFile="~/WebMaster/OpenWin_FixHead.Master" AutoEventWireup="true" CodeBehind="ProjectReport.aspx.cs" Inherits="HuaiNanSys.Page.Pr
  • headroom.js插件使用方法

    千次阅读 2014-02-21 15:25:52
    1.什么是headroom.js? Headroom是用纯Javascript的插件,用来隐藏和展示页面元素,从而为页面留下更多空间。比如使用headroom能使导航栏当页面下滚时消失,当页面上滚时候又出现。(查看效果)
  • 在前后端分离项目(如:VUE)中集成调用PageOffic的Demo示例
  • 开源网盘系统推荐 - 蓝眼云盘 - 安装及开发教程 介绍 ...后端使用Golang语言,前端采用Vue框架;前端打包后的静态文件夹放置于后端/html目录下,后端对前后端资源做统一路由。 eyebluecn/tank ...
  • 超齐全的编程开发资源集

    万次阅读 2016-07-21 09:50:50
    网上看到的资源集合,挺有用的,在这里加上自己的收藏分享一下。 stackoverflow:IT技术问答网站 GitHub:全球最大的源代码管理平台,很多知名开源项目都在上面,如Linux内核 Hacker News:非常棒的针对编程的链接...
  • 廖雪峰Python 3.X 教程

    万次阅读 2016-09-03 12:20:59
    Python简介 Python是著名的“龟叔”Guido van Rossum在1989年圣诞节期间,为了打发无聊的圣诞节而编写的一个编程语言。 现在,全世界差不多有600多种编程语言,但流行的编程语言也就那么20来种。...
  • 廖雪峰Python 2.X 教程

    万次阅读 2016-09-03 12:21:34
    Python简介 Python是著名的“龟叔”Guido van Rossum在1989年圣诞节期间,为了打发无聊的圣诞节而编写的一个编程语言。 现在,全世界差不多有600多种编程语言,但流行的编程语言也就那么20来种。...
  • FCKeditor使用详解(汇总)

    千次阅读 2008-06-06 17:57:00
    FCKeditor是目前最好的html文本编辑器,如果还不明白的话看了下图就知道了效果图:那么为什么说是FCKeditor的冰冷之心呢?这不是哗众取宠,主要是说它使用起来有点麻烦,下文就详细说明如何搞定这玩意儿。...
1 2 3 4 5 ... 7
收藏数 125
精华内容 50
关键字:

pageoffice vue引用