How to Build an Online File Preview Service with Spring Boot and kkFileView
This guide explains why online file preview is needed, introduces the open‑source kkFileView solution built on Spring Boot, and walks through installing it via source or Docker, configuring the preview API, and testing various document formats directly in a browser.
In modern work environments, sharing and viewing files without downloading saves storage, improves efficiency, and reduces security risks. Traditional workflows require local downloads, which the article identifies as a problem.
The article presents kkFileView, an open‑source file‑preview system built on the Spring Boot framework, as a solution. It lists its key features: support for many document, image, audio, video, archive, and code formats; easy deployment via ZIP/TAR.GZ packages or Docker images; cross‑platform operation; high performance with efficient streaming; security through access tokens; RESTful APIs for Java, PHP, Python, Go; Apache 2.0 licensing; and extensibility for adding new formats.
Installation and Deployment
Download and Run from Source
Download the latest release package from https://gitee.com/kekingcn/file-online-preview/releases.
Extract the package ( .zip on Windows, .tar.gz on Linux/MacOS).
Run the startup script in the bin directory ( startup.bat as administrator on Windows, startup.sh as root on Linux).
Open a browser and visit http://127.0.0.1:8012 to see the demo homepage.
Docker Deployment
docker run -it -p 8012:8012 keking/kkfileview:4.1.0If network issues arise, the article suggests pulling the image manually:
wget https://kkfileview.keking.cn/kkFileView-4.1.0-docker.tar
docker load -i kkFileView-4.1.0-docker.tar
docker run -it -p 8012:8012 keking/kkfileview:4.1.0After starting, the UI is displayed as shown in the included screenshot.
File Preview Usage
To preview a file, call the kkFileView preview endpoint with the file URL encoded in Base64. The article provides a complete HTML example that defines six file URLs (CSV, PNG, DOC, PDF, PPTX, MD) and creates buttons that open the preview page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/base64.min.js"></script>
</head>
<body>
<script>
var url1 = 'http://192.168.43.178:8080/1.csv';
var url2 = 'http://192.168.43.178:8080/2.png';
var url3 = 'http://192.168.43.178:8080/3.doc';
var url4 = 'http://192.168.43.178:8080/4.pdf';
var url5 = 'http://192.168.43.178:8080/5.pptx';
var url6 = 'http://192.168.43.178:8080/6.md';
</script>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url1)))">csv</button><br>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url2)))">png</button><br>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url3)))">doc</button><br>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url4)))">pdf</button><br>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url5)))">pptx</button><br>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url6)))">md</button><br>
</body>
</html>When a button is clicked, the browser opens http://127.0.0.1:8012/onlinePreview?url= with the Base64‑encoded file URL, and kkFileView renders the file directly in the browser.
The article concludes that the approach is straightforward, and while integrating kkFileView into an existing project requires analyzing its API and merging code, experienced developers should find it manageable.
Signed-in readers can open the original source through BestHub's protected redirect.
This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactand we will review it promptly.
Programmer XiaoFu
xiaofucode.com – a programmer learning guide driven by the pursuit of profit
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.