文件在線預覽kkFileView的使用

kkFileView是使用spring boot打造文件文檔在線預覽項目解決方案，支持doc、docx、ppt、pptx、xls、xlsx、zip、rar、mp4、mp3以及眾多類文本如txt、html、xml、java、properties、sql、js、md、json、conf、ini、vue、php、py、bat、gitignore等文件在線預覽，然后前端直接使用后端地址即可進行訪問（前端使用方法，地址代理方法，在文章最后有寫）

 

一、項目特性

1. 支持office，pdf等辦公文檔
2. 支持txt,java,php,py,md,js,css等所有純文本
3. 支持zip,rar,jar,tar,gzip等壓縮包
4. 支持jpg，jpeg，png，gif等圖片預覽（翻轉，縮放，鏡像）
5. 使用spring boot開發，預覽服務搭建部署非常簡便
6. rest接口提供服務，跨平台特性(java,php,python,go,php，....)都支持，應用接入簡單方便
7. 抽象預覽服務接口，方便二次開發，非常方便添加其他類型文件預覽支持
8. 最最重要Apache協議開源，代碼pull下來想干嘛就干嘛

 

二、在線體驗

請善待公共服務，會不定時停用

地址：http://file.keking.cn/

 

三、項目文檔（Project documentation）

1. 詳細wiki文檔：https://gitee.com/kekingcn/file-online-preview/wikis/pages
2. 中文文檔：https://gitee.com/kekingcn/file-online-preview/blob/master/README.md
3. English document：https://github.com/kekingcn/kkFileView/blob/master/README.en.md

 

五、預覽效果

 

五、前端使用

前端使用方法文檔里有寫，但是不是很詳細，這里在說明一下

　　1.使用預覽

var originUrl = 'http://127.0.0.1:8080/filedownload?fileId=1'; //要預覽文件的訪問地址（可以是下載地址）
var previewUrl = originUrl + '&fullfilename=test.txt'  //要預覽文件的名字（可選擇使用，不是必填項）
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(previewUrl));  //地址記得轉碼

　　2.使用代理

　　　　如果不想暴露服務器部署的地址和端口，前端可以使用代理的方式，我們項目用的nuxt構建，所以可以在nuxt.config.js的proxy添加一條規則即可

proxy: [
  [
    '/preview',
    {
      target: 'http://xxx.xxx.com.cn:8012',
      pathRewrite: {
        '^/preview': '/'
      }
    }
  ]
]

　　然后使用的時候，在訪問的鏈接加上這個過濾‘/preview’即可

let originUrl = 'http://127.0.0.1:8080/filedownload?fileId=1'

var previewUrl = originUrl + '&fullfilename=test.txt' 

window.open('/preview/onlinePreview?url='+encodeURIComponent(previewUrl)); 

　　這樣訪問的時候，前端自動會把預覽文件的地址轉發到服務器的預覽地址，而不會直接暴露服務器配置和端口

　　服務器內部也可以是使用nginx代理來配置，跟nuxt代理一致，這里不再詳細描述~~

 

 

 

 

嗯，就醬~~