1.环境要求:

  java 1.8+

2.部署运行:

  本机以及虚拟机上运行:

    1.从https://gitee.com/kekingcn/file-online-preview/releases地址下载最新的版发行包

    2.解压kkFileView-2.x.x.Zip包

    3.打开解压后文件夹的bin目录,运行startup脚本(Windows下以管理员身份运行startup.bat,Linux以root用户运行startup.sh)

    4.浏览器访问本机8012端口(http://127.0.0.1:8012 )即可看到项目演示用首页

3.项目实施:

  在文件上传组件后配置预览选项

  <span @click='preView'>预览</span>

  点击方法

  preView(){

   var originUrl = 'http://127.0.0.1:8080/filedownload?fileId=1'; //要预览文件的访问地址

   var previewUrl = originUrl + '&fullfilename='+文件名称

   window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(previewUrl));

  }

4.kkFileView文档:

  https://gitee.com/kekingcn/file-online-preview/wikis/Home?sort_id=1444366

vue使用kkfileview文件预览功能的更多相关文章

  1. 利用 ICEpdf 快速实现 pdf 文件预览功能

    之前工作中,需要实现一个在线预览pdf的功能,一开始用的的 jQuery-media 插件来实现的,后来感觉有点慢,就继续寻找更好的替代品,直到遇见了 ICE pdf... ICEpdf (官网:ht ...

  2. win10打文件预览功能

  3. JS通过使用PDFJS实现基于文件流的预览功能

    需求: 使用JS实现PDF文件预览功能 备选方案: 使用ViewerJS,官网  http://viewerjs.org/ 使用PDFJS,官网  https://mozilla.github.io/ ...

  4. java实现office文件预览

    不知觉就过了这个久了,继上篇java实现文件上传下载后,今天给大家分享一篇java实现的对office文件预览功能. 相信大家在平常的项目中会遇到需要对文件实现预览功能,这里不用下载节省很多事.大家请 ...

  5. COS控制台进阶 - 文件预览和在线编辑

    导语 | COS控制台新上线了文件预览功能,用户可在控制台内直接预览.编辑文件内容. 前不久,微软发布了 vscode for web 的公告,是基于web的在线代码编辑器,无需下载安装可以直接在we ...

  6. fis3+vue+pdf.js制作预览PDF文件或其他

    人生第一篇博客,的确有点紧张,但有些许兴奋,因为这对于我来说应该是一个好的开始,以此励志在技术的道路上越走越远. 看过了多多少少的技术博客,给自己带来了很多技术上的收获,也因此在想什么时候自己也可以赠 ...

  7. Vue PDF文件预览vue-pdf

       最近做项目,遇到预览PDF这个功能,在网上找了找,大多推荐的是pdf.js,不过在Vue中还是想偷懒直接npm组件,最后找到了一个还不错的Vue-pdf 组件,GitHub地址:https:// ...

  8. Django文件上传三种方式以及简单预览功能

    主要内容: 一.文件长传的三种方式 二.简单预览功能实现 一.form表单上传 1.页面代码 <!DOCTYPE html> <html lang="en"> ...

  9. 原生js实现ajax的文件异步提交功能、图片预览功能.实例

    采用html5使得选择图片改变时,预览框中图片随之改变.input文件选择框美化.原生js完成文件异步提交 效果图: 代码如下,可直接复制并保存为html文件打开查看效果 <html> & ...

随机推荐

  1. .net对象与IntPtr"互转"

    写于2015-1-29 16:17 由qq空间转过来,格式有点乱 "互转"这里其实只是GC分配的一个IntPtr,通过这个IntPtr引用操作而真正的托管对象与非托管对象的互转应使 ...

  2. Eclipse 如何添加 更换字体(转载)

    1. 打开eclipse-->Window-->Preferences-->General-->appearance-->Colors and Fonts, 点开后选择B ...

  3. Elasticsearch客户端源码剖析

    注:本文出自博主 Chloneda:个人博客 | 博客园 | Github | Gitee | 知乎 注:本文源链接:https://www.cnblogs.com/chloneda/p/es-cli ...

  4. MySQL学习 2019-12-30

    启动mysql服务: net start mysql 关闭mysql服务: net stop mysql cmd清屏: cls mysql -V 输出版本信息并且退出 mysql -u 用户名 mys ...

  5. Perl-统计文本中各个单词出现的次数(NVDIA2019笔试)

    1.原题 2.perl脚本 print "================ Method 1=====================\n"; open IN,'<','an ...

  6. MY_0002:导出单位设置

    1,导出模型给canvas工具用时,设置单位为m,再参考模型所占网格大小.

  7. MySQL 8 批处理模式

    shell> mysql -h host -u user -p < batch-file 强制执行脚本,即使某些语句参数错误,可以添加 --force 参数 如果MySQL运行在Windo ...

  8. linux服务基础之nginx配置详解

    nginx简单介绍:https://www.cnblogs.com/ckh2014/p/10848670.html nginx编译安装:https://www.cnblogs.com/ckh2014/ ...

  9. 网站后门shell-----eval

    我们先来看看网站被攻击的代码: <?php error_reporting(E_ERROR); unlink('user.php'); unlink('../member/login.php') ...

  10. PAT (Basic Level) Practice (中文)1070 结绳 (25 分) (优先队列)

    给定一段一段的绳子,你需要把它们串成一条绳.每次串连的时候,是把两段绳子对折,再如下图所示套接在一起.这样得到的绳子又被当成是另一段绳子,可以再次对折去跟另一段绳子串连.每次串连后,原来两段绳子的长度 ...