vue项目接入kkFileView

最新推荐文章于 2025-03-05 10:30:37 发布
原创 最新推荐文章于 2025-03-05 10:30:37 发布 · 440 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#kkFileView

需求背景

最近需要用到kkFileView来预览PDF文件，所以有了这篇文章。

操作教程

1、下载或克隆kkFileView项目

https://gitee.com/kekingcn/file-online-preview.git

2、idea导入项目

这里idea打开项目时候，一定要选择自己的本地maven，如果你使用的是idea默认的maven那么打包会失败。

3、打包

4、上传文件到服务器

这里使用的是centos7.9的服务器，所以需要只需要上传KKFileView-4.4.0.tar.gz文件即可。在服务器上不需要再建立文件夹了，这个tar.gz文件中已经有了一个文件夹，直接解压即可。


                

        

    



  


        

                

                  

                  

                  了解本专栏
                  
                  
                    
                  订阅专栏 解锁全文
                   
                  
                    
                    超级会员免费看
                  
                

            
            
            
        


    



                



	

		

			

				
					
ruoyi框架接入kkFileView

				
			

			

				

					renkai721的专栏
				

				

					03-05
					
					368
					
				

			

		

		

			
				
kkFileView文档在线预览项目解决方案，kkFileView部署教程，vue项目接入kkFileView，ruoyi框架接入kkFileView，bootstrap接入kkFileView，pdf在线预览，word在线预览，office在线预览

			
		

	



                

            
              



	

		

			

				
					
SpringBoot+Vue+kkFielView实现文件预览时提示:Illegal base64 character 3a以及Vue中安装Base64编码url解决

				
			

			

				

					BADAO_LIUMANG_QIZHI的博客
				

				

					12-12
					
					2354
					
				

			

		

		

			
				
kkFileView为文件文档在线预览解决方案，该项目使用流行的spring boot搭建，易上手和部署，基本支持主流办公文档的在线预览，如doc,docx,xls,xlsx,ppt,pptx,pdf,txt,zip,rar,图片,视频,音频等等。在接入并进行预览时提示找到kkFileView目录下log下kkFileView.log文件查看具体报错这是因为一开始没将预览文件url进行Base64编码导致。注：博客：关注公众号霸道的程序猿。

			
		

	



              


  
              

                


	

		

			

				
					
使用vue+kkFileview组件实现各种类型文件预览

				
			

			

				

					老徐的博客只有干货
				

				

					10-24
					
					2427
					
				

			

		

		

			
				
项目使用Vue获取需要预览的项目文件列表，然后调用kkFileview预览接口实现文档在线预览。通过切换select option选项实现文件预览切换，非常贴近实际业务。

			
		

	





	

		

			

				
					
Vue3使用kkFileView预览文件pdf

				
			

			

				

					前端程序媛_Ying博客
				

				

					11-27
					
					2753
					
				

			

		

		

			
				
kkFileView - 在线文件预览kkFileView官网 - kkFileView使用Spring Boot搭建，易上手和部署，基本支持主流办公文档的在线预览，如doc,docx,Excel,pdf,txt,zip,rar,图片等等业务场景：需要点击按钮，弹出弹框预览pdf文件这里使用的是3.x.x 版本，需要下载base64。

			
		

	



		

			
		



	

		

			

				
					
kkViewFile在线文件部署及使用（局域网部署）

				
			

			

				

					穿背心的程序猿
				

				

					09-08
					
					5850
					
				

			

		

		

			
				
kkViewFile在线文件部署及使用（局域网部署）;
kkViewFile使用踩坑记录；
kkViewFile启动报错：找不到office组件，请确认’office.home’配置是否有误

			
		

	





	

		

			

				
					
kkFileView在线文件预览与项目集成

				
			

			

				

					wangwei的博客
				

				

					05-09
					
					1208
					
				

			

		

		

			
				
在线文件预览与项目的集成

			
		

	





	

		

			

				
					
vue3项目使用kkFileView实现文档在线预览

				
			

			

				

					iuan429520的博客
				

				

					07-02
					
					2628
					
				

			

		

		

			
				
vue项目使用kkFileView实现文档在线预览功能。

			
		

	





	

		

			

				
					
Vue项目中集成kkFileView实现文件预览功能

				
			

			

				

					
				

			

		

		

			
				
从描述内容来看，该项目的核心目标是在 Vue 构建的前端系统中无缝接入 kkFileView 预览服务，并解决实际开发中常见的权限控制问题——即通过 token 认证机制保障文件访问的安全性。传统的文件预览往往存在直接暴露...

			
		

	





	

		

			

          精选资源
				
					
kkFileView在线预览-其他

				
			

			

				

					06-24
				

			

		

		

			
				
kkFileView是一款使用spring boot打造的文件文档在线预览项目解决方案，支持doc、docx、ppt、pptx、xls、xlsx、zip、rar、mp4、mp3以及众多类文本如txt、html、xml、java、properties、sql、js、md、json、conf、ini...

			
		

	





	

		

			

				
					
bootstrap接入kkFileView

					
最新发布

				
			

			

				

					renkai721的专栏
				

				

					03-05
					
					130
					
				

			

		

		

			
				
kkFileView文档在线预览项目解决方案，kkFileView部署教程，vue项目接入kkFileView，ruoyi框架接入kkFileView，bootstrap接入kkFileView，pdf在线预览，word在线预览，office在线预览

			
		

	





	

		

			

				
					
kkFileView，spring boot打造文件文档在线预览项目解决方案

				
			

			

				

					11-03
				

			

		

		

			
				
使用spring boot打造文件文档在线预览项目解决方案，支持doc、docx、ppt、pptx、xls、xlsx、zip、rar、mp4，mp3以及众多类文本如txt、html、xml、java、properties、sql、js

			
		

	





	

		

			

				
					
使用 kkFileView 实现在线文件预览

				
			

			

				

					七号程序员的博客
				

				

					06-09
					
					4102
					
				

			

		

		

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

			
		

	





	

		

			

				
					
以kkFileView为基础，可嵌入项目的前后端分离版（springboot+vue）文件预览系统结合若依框架前后端分离版的使用

				
			

			

				

					qq_55896432的博客
				

				

					10-18
					
					3534
					
				

			

		

		

			
				
此代码是以kkFileView版本4.3.0为基础，将原有的独立文件预览系统拆分为springboot+vue的可嵌入式文件预览系统，并且在原有基础上进行了部分代码增加、修改和删除。

			
		

	





	

		

			

				
					
基于vueant集成kkFileView实现文件预览

				
			

			

				

					Instanceztt的博客
				

				

					10-19
					
					1092
					
				

			

		

		

			
				
最近项目中遇到了pdf预览,在github上发现kkFileView这个开源项目对图片的预览有较好的处理,本文基于vueant框架集成vueant做简要概述。

			
		

	





	

		

			

				
					
vue2后台系统需要接入文件预览项目，使用kkFileView预览组件达到对docx、excel、ppt、jpg等文件的预览效果

				
			

			

				

					m0_73571867的博客
				

				

					11-30
					
					1331
					
				

			

		

		

			
				
vue中实现批量文件上传和多类型文件在线预览功能

			
		

	





	

		

			

				
					
SpringBoot+Vue+kkFileView实现文档管理(文档上传、下载、在线预览)

				
			

			

				

					BADAO_LIUMANG_QIZHI的博客
				

				

					07-31
					
					2236
					
				

			

		

		

			
				
上面在使用OpenOffice实现doc、excel、ppt等文档的管理和预览。除此之外可用kkFileView实现包括且更多文档的预览。

			
		

	





	

		

			

				
					
kkfileview代理配置，Vue对接kkfileview实现图片word、excel、pdf预览

				
			

			

				

					w15635748705的博客
				

				

					12-21
					
					2197
					
				

			

		

		

			
				
官网：https://kkfileview.keking.cn/zh-cn/docs/production.html这个是官网部署网址，这里推荐大家使用docker镜像部署，因为我是直接找运维部署的，所以这里我就不多说明了，主要说下nginx代理配置，以及接入kkfileview实现图片预览和Office系列的预览。这里可以给大家提供一个银河麒麟v10上面部署的方案，建议使用如下方法的话去找经验丰富的运维，不过对于运维来说比较简单，对于Java开发，就我个人来说难死了。

			
		

	





	

		

			

				
					
KKFileView结合vue多格式文件在线预览

				
			

			

				

					乐于分享，共同成长
				

				

					02-02
					
					1498
					
				

			

		

		

			
				
KKFileView结合vue多格式文件在线预览

			
		

	





	

		

			

				
					
kkfileView

				
			

			

				

					Blue的博客
				

				

					07-19
					
					3389
					
				

			

		

		

			
				
kkFileView是一个基于Spring Boot框架构建的文件文档在线预览解决方案，它提供了广泛的文件类型支持、易部署性、跨平台服务、二次开发友好等多种特性。

			
		

	





	

		

			

				
					
linux部署ruoyi

				
			

			

				

					01-09
				

			

		

		

			
				
### 部署 RuoYi 项目于 Linux 的逐步指导

#### 准备工作环境
为了成功部署 RuoYi 项目，需先安装必要的软件包和服务。这通常包括 Java 运行时环境 (JRE)，因为 RuoYi 是基于 Spring Boot 构建的应用程序，它依赖于 JVM 来执行[^1]。

```bash
sudo apt update && sudo apt install default-version
```

#### 获取源码并配置数据库连接
下载或克隆最新的 RuoYi 源代码到服务器上，并按照官方文档中的说明设置 MySQL 数据库连接字符串和其他必要参数[^2]。

```properties
spring.datasource.url=jdbc:mysql://localhost:3306/ruoyi?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=true&serverTimezone=GMT%2B8
spring.datasource.username=root
spring.datasource.password=yourpasswordhere
```

#### 编译打包应用
利用 Maven 工具来编译和构建整个应用程序为可独立运行的 JAR 文件形式。确保本地已正确设置了 MAVEN_HOME 和 PATH 变量以便命令能够被识别[^3]。

```bash
mvn clean package -Dmaven.test.skip=true
```

#### 启动服务端口监听
通过 `nohup` 或者 systemd service 方式让 spring boot jar 包以后台进程的方式启动，在生产环境中推荐使用后者以获得更好的管理和稳定性支持[^4]。

创建一个简单的 Systemd Service Unit File `/etc/systemd/system/ruoyi.service`:

```ini
[Unit]
Description=RuoYi Application Server
After=syslog.target

[Service]
User=nobody
ExecStart=/usr/bin/java -jar /path/to/target/ruoyi-admin.jar --spring.profiles.active=prod
SuccessExitStatus=143

[Install]
WantedBy=multi-user.target
```

接着启用该服务：

```bash
systemctl enable ruoyi.service
systemctl start ruoyi.service
systemctl status ruoyi.service
```

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

  

	
    

      

      

      

        
        

          
          

            

              成就一亿技术人!
            

            

              拼手气红包6.0元
            

          

        

        

          

            还能输入1000个字符
          

          

             
          

          

            

              红包
              添加红包
            

            

              表情包
              插入表情
              

                

              

            

            

              表情包
              代码片
              

                
              

            

            

              
              
              
              
              
              
              
            

          

        

      

    

		

			

			

			

					 条评论被折叠 查看
			

			

				
			

		

	

	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  





	
打赏作者

	

		

		
			
		
		

		

			
renkai721

			
谢谢您的打赏！

		

	

	

			

	

	

    ¥1
    ¥2
    ¥4
    ¥6
    ¥10
    ¥20
	

	

		

			

				

					扫码支付：¥1
				

				

					

					
					获取中
					

				

				

					
					
					扫码支付
				

			

		

		

			
您的余额不足，请更换扫码支付或充值

			
打赏作者

		

	



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值