点击文件实现WPS工具预览功能

该博客介绍了如何在项目中实现点击文件触发WPS预览功能,包括在组件文件夹中创建api.js、index.vue和jwps.js文件,调整路由配置,以及设置点击事件来跳转到WPS预览页面。
摘要由CSDN通过智能技术生成

页面如图:
在这里插入图片描述
需要点击对应文件名弹窗WPS文件预览页面,效果如下:
在这里插入图片描述
在这里插入图片描述

一、首先在组件文件夹中建立如下文件

在这里插入图片描述
api.js文件如下:需与后端联调


import request from '@/router/axios'


// 一键生成
export const hybgxxJsbg = (query) => {
  return request({
    url: '/swbj/hybgxx/jsbg',
    method: 'post',
    data: query
  })
}

// 下载
export const officeUrl = (name) => {
  return request({
    url: '/wbjk/weboffice/url?_w_fname=' + name,
    method: 'get'
  })
}

index.vue文件如下:页面中使用了api文件中的两个接口,需后端提供联调使用

<template>
  <div>
  </div>
</template>

<script>
  import { hybgxxJsbg,officeUrl } from  './api'
  import './jwps.js'

    export default {
      name: "index",
      data() {
        return {
          bgnr: ''
        }
      },
      created(){
          if (this.$route.query.ids) {
            let para = {}
            para['ids'] = JSON.parse(this.$route.query.ids)
            para['flfgIds'] = JSON.parse(this.$route.query.flfgIds)
            para['dwmc'] = this.$route.query.dwmc
            para['realname'] = this.$route.query.realname
            console.log(para,'para')
            console.log(this.$route,'this.$route')
            hybgxxJsbg(para).then(res=>{
              this.$message.success('生成成功!请等待加载...')
              this.bgnr = res.data.data.bgnr.split('fw-')[1]
              this.openFile()
            })
          }else {
            this.bgnr = this.$route.query.bgnr.split('fw-')[1]
            this.openFile()
          }
      },
      mounted(){ },
      methods:{
        openFile() {
          officeUrl(this.bgnr).then(res=>{
            let wps = WPS.config({wpsUrl: res.data.wpsUrl});
            wps.setToken({token: res.data.token});
            window.setTimeout(function() {
              let div = document.getElementById('wps-iframe')
              div.style.width = '100%'
              div.style.height = '100%'
            }, 2000)
          })
        }
      },
    }
</script>

<style>
  html{
    overflow: hidden;
  }
</style>

jwps.js文件如下:直接复制就可以使用

!function(e,t){"objec
### 回答1: Java可以通过使用相关的库或插件来支持微软Office和金山的WPS预览。这些库或插件可以实现将Office文档(如Word、Excel和PowerPoint文档)和WPS文档加载到Java应用程序中进行预览功能。使用这些库或插件,我们可以在Java应用程序中打开、预览和操作这些文档。 对于微软Office文档的预览Java可以使用一些第三方库,如Apache POI或Aspose来实现。这些库可以读取Office文档的内容,并提供访问和处理文档的功能。例如,我们可以使用Apache POI库将Word文档打开并将其内容显示在Java应用程序中,或者使用Aspose来将Excel表格加载到Java应用程序中进行预览。 对于WPS文档的预览Java可以使用金山提供的WPS Office软件的开发包(SDK)来实现WPS Office提供了Java版本的SDK,它可以用于在Java应用程序中加载和预览WPS文档。使用WPS SDK,我们可以打开、读取和显示WPS文档的内容,以实现WPS文档的预览功能。 通过使用这些库或SDK,Java可以与微软Office和金山的WPS进行集成,从而在Java应用程序中实现对Office和WPS文档的预览功能。这使得开发者可以使用Java来处理并展示这些常见的办公文档格式,提供更好的用户体验,满足用户对预览功能的需求。 ### 回答2: 是的,Java可以支持微软Office和金山WPS预览功能Java提供了丰富的API和库,用于处理各种文件格式,包括Microsoft Office和WPS的文档格式。通过使用Java的相关类,可以读取和解析这些文档的内容,并将其显示在应用程序中,实现预览功能。 对于Microsoft Office,Java提供了Apache POI库,它可以读取和处理Word文档(doc和docx)、Excel电子表格(xls和xlsx)以及PowerPoint演示文稿(ppt和pptx)等格式。开发者可以使用POI库来从Office文档中提取文本、图像、表格等内容,并在Java应用程序中进行显示和预览。 对于金山WPSJava也可以通过API来实现预览功能。金山WPS的文档格式与微软Office类似,大部分文件都可以使用Apache POI库进行处理。另外,金山WPS也提供了自己的Java SDK,开发者可以使用它来读取和处理WPS文档,并进行预览。 总的来说,Java提供了丰富的功能和库,可以支持微软Office和金山WPS预览功能。开发者可以根据具体的需求,选择适合自己的API和库来实现预览,从而提供更好的用户体验和功能扩展。 ### 回答3: Java 的确支持微软 Office 和金山的 WPS 预览。这得益于 Java 语言强大的跨平台特性和丰富的第三方库支持。 对于微软 Office 预览Java 提供了 Apache POI 这个开源项目。Apache POI 是一个 Java API,它允许我们读取、写入和操作 Microsoft Office 格式的文件,包括 Word 文档 (.docx),Excel 电子表格 (.xlsx) 和 PowerPoint 演示文稿 (.pptx) 等。 使用 Apache POI,我们可以从 Java 程序中读取 Office 文件内容,包括文本、样式、表格、图表等。同时,我们也可以通过 Apache POI 创建、编辑以及生成 Office 文件。这使得 Java 程序能够轻松实现对微软 Office 文件预览功能。 至于金山 WPS预览Java 提供了 Jacob 这个开源项目。Jacob 是一个 Java-COM 桥接器,通过它可以在 Java 程序中调用 COM 组件,而 WPS 就是一个 COM 组件。借助 Jacob,我们可以在 Java 中使用 WPS 的 COM 接口,实现WPS 文档的打开、预览和操作等功能。 需要注意的是,使用 Apache POI 和 Jacob 需要获取相应的库文件,并在 Java 程序中进行引用。并且,在使用 Jacob 时还需要配置正确的 COM 组件路径。但是,一旦正确配置并引入所需库,Java 就能很方便地支持微软 Office 和金山 WPS预览。 综上所述,Java 确实支持微软 Office 和金山 WPS预览,而 Apache POI 和 Jacob 这两个开源项目为我们提供了强大的工具和桥接器,使得我们能够在 Java实现对这两种格式的文档进行预览操作。
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值