Spring Boot + kkFileView-2.1.2 实现文档在线预览

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

1. 下载kkFileview：https://gitee.com/kekingcn/file-online-preview/releases

2. 启动服务

进入 bin 目录，双击 startup.bat 启动服务

3. 访问 http://127.0.0.1:8012 测试是否成功启动服务

4. 设置 Spring Boot 内置 tomcat 虚拟映射

@Configuration
public class WebConfig implements WebMvcConfigurer { /**
* 虚拟路径配置
* @param registry
*/
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/upload/**").addResourceLocations("file:F:/tomcat-upload/");
}
}

5. 编写测试代码

<input type="hidden" th:value="${staticPath}" id="staticPath"/>
<button type="button" onclick="kkFileview();"/>点击预览

/**
* kkFileview 在线预览文档
*/
function kkFileview() {
var url = $("#staticPath").val();
var kkFileUrl = "http://localhost:8080/lcsin-blog"+url;//拼接预览文件的url
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(kkFileUrl));//交由kkFileview实现在线预览
}

6. 预览效果

使用图片预览效果