使用 kkFileView 实现在线文件预览

需求描述：vue2后台管理项目，点击列表操作按钮--查看文件，预览相应文件。

 效果：点击后会在新窗口打开，如下图：

写在前面：此文只涉及前端使用部分，后端部署方面可进入官方文档“部署指南”模块自行查找。

附上官方文档地址：kkFileView - 在线文件预览

kkFileView 使用流行的spring boot搭建，支持预览doc,docx,Excel,pdf,txt,zip,rar,图片等格式的文件。

使用过程：

1、安装js-base64

npm install js-base64 --save-dev

在使用Base64的组件中引入Base64

import { Base64 } from 'js-base64';

2、本例使用的是“普通文件下载url预览”，是后端将文件链接返回给前端

var url = 'http://127.0.0.1:8080/file/test.docx';  //要预览文件的访问地址 
window.open('http://后端部署的域名/onlinePreviewurl='+encodeURIComponent(Base64.encode(url)));

至此可以实现在线文件预览。

欢迎大家提出问题！