`
lxywangjin
  • 浏览: 12732 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JSP使用ckfinder实现Ajax文件上传

    博客分类:
  • JSP
阅读更多

最近学习使用ckfinder实现文件上传,下面详细介绍一下ckfinder在JSP中的应用

1、下载ckfinder

 

      ckfinder官网下载Java版本的ckfinder。

 

2、解压文件

 

      解压下载的zip文件,解压后的目录下有CKFinderJava.war文件,把该文件放入Tomcat的webapp目录下,启动Tomcat,Tomcat的webapp目录下会生成CKFinderJava文件夹。 

 

3、配置java web项目

 

     (1).复制WEB-INF目录下的config.xml文件到你的项目WEB-INF目录下,并修改如下两处

 

            <enabled>false</enabled>修改为<enabled>true</enabled>

 

            <baseURL>/CKFinderJava/userfiles/</baseURL>其中CKFinderJava为你的项目名称

 

     (2).复制lib里的所有jar文件

 

            把CKFinderJava文件夹里的WEB-INF\lib目录下的所有jar文件复制到自己的Web项目的WEB-INF\lib目录下。

 

     (3).修改你的java web项目的web.xml文件

 

           打开CKFinderJava文件夹里的WEB-INF目录下的web.xml文件,并把以下的代码复制到自己的Web项目的WEB-INF目录下的web.xml文件中。在web.xml中增加如下片段:

 

      <servlet>
		<servlet-name>ConnectorServlet</servlet-name>
		<servlet-class>com.ckfinder.connector.ConnectorServlet</servlet-class>
		<init-param>
			<param-name>XMLConfig</param-name>
			<param-value>/WEB-INF/config.xml</param-value>
		</init-param>
		<init-param>
			<param-name>debug</param-name>
			<param-value>false</param-value>
		</init-param>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>ConnectorServlet</servlet-name>
		<url-pattern>
			/ckfinder/core/connector/java/connector.java
		</url-pattern>
	</servlet-mapping>
	<filter>
		<filter-name>FileUploadFilter</filter-name>
		<filter-class>com.ckfinder.connector.FileUploadFilter</filter-class>
                <init-param>
                    <param-name>sessionCookieName</param-name>
                    <param-value>JSESSIONID</param-value>
                </init-param>
                <init-param>
                    <param-name>sessionParameterName</param-name>
                    <param-value>jsessionid</param-value>
                </init-param>
	</filter>
	<filter-mapping>
		<filter-name>FileUploadFilter</filter-name>
		<url-pattern>
			/ckfinder/core/connector/java/connector.java
     	 </url-pattern>
	</filter-mapping>
	<session-config>
		<session-timeout>10</session-timeout>
	</session-config>
	<welcome-file-list>
		<welcome-file>index.jsp</welcome-file>
	</welcome-file-list>

 

4、把ckfinder文件加入WEB项目

         

        CKFinderJava文件夹下的ckfinder文件夹复制到WEB项目的WebContent文件夹下

 

5、在JSP中使用ckfinder

      

      JSP使用ckfinder代码如下:

 

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="ckfinder/ckfinder.js"></script>
<title>JSP使用ckfinder实现Ajax文件上传</title>
</head>
<body>
<script type="text/javascript">
	var finder = new CKFinder();
	finder.basePath = 'ckfinder/';
	finder.create();
</script>
</body>
</html>

 

6、把WEB项目部署到Tomcat,然后启动Tomcat,在浏览器中输入你的jsp访问地址,如:http://localhost:6060/CKFinderJava/index.jsp,效果图如下:



 

 下面说说我在配置的过程中遇到的问题,访问JSP页面时,弹出“因为安全原因,文件不可浏览. 请联系系统管理员并检查CKFinder配置文件”的提示!如下图所示:



 

解决办法:

      

       修改WEB-INF目录下的config.xml文件,把 <enabled>false</enabled>修改为<enabled>true</enabled>即可解决。

 

  • 大小: 28.1 KB
  • 大小: 10 KB
2
0
分享到:
评论

相关推荐

    JSP使用ckeditor和ckfinder实现富文本及文件上传

    3. ckfinder的集成与应用:了解ckfinder的功能和如何在JSP中实现文件上传与管理。 4. 文件上传处理:通过Servlet处理文件上传请求,包括文件的接收、保存以及安全验证。 5. 前后端的文本验证:确保用户输入的有效性...

    整合ckeditor+ckfinder实现图片或文件上传功能

    以上配置告诉`ckeditor`使用`ckfinder`来浏览和上传文件及图片。`filebrowserBrowseUrl`和`filebrowserUploadUrl`分别用于文件浏览和上传,`filebrowserImageBrowseUrl`和`filebrowserImageUploadUrl`则是针对图片的...

    CKFinder前台上传文件插件

    `使用 JavaScript File API 实现文件上传.zip` 文件可能包含了一个使用JavaScript的File API实现前端文件上传的示例。File API是HTML5的一部分,允许在浏览器端直接处理文件,包括读取、写入和上传,这有助于创建无...

    ckfinder修改文件名称

    为了实现这一功能,开发者可能对CKFinder的内部类或方法进行了调整,尤其是涉及文件上传、命名和存储的部分。可能涉及到的Java类可能包括`Uploader`、`FileUtils`或与文件操作相关的自定义处理器。他们可能添加了对...

    java版ckfinder文件管理Demo

    在Java后端,你需要实现CKFinder的后端连接器,处理文件上传、下载等操作。CKFinder提供了一套基于Servlet的API,你需要创建一个Servlet并覆盖相应的接口方法。例如,处理文件上传的代码可能如下: ```java import ...

    关于jsp中ckeditor+ckfinder

    然而,ckeditor本身并不具备文件上传功能,为了实现文件上传的需求,通常需要结合ckfinder使用。 ckfinder是一款功能强大的文件管理器,它可以很好地集成到ckeditor中,提供文件浏览、上传和管理等功能。通过...

    kcfinder4j(java版kcfinder,ckfinder,ajax在线文件管理)

    大家还在找ckfinder的java版吗? 我一直都没找到,或者找到的又诸多错误。 尝试过tomcat跑php来运行ckfinder和kcfinder,但还是有问题。 索性自己做一个了。 当然我这个只是一个demo,没有图片缩略功能。 但基本的...

    Ckeditor + ckfinder整合for JAVA(支持文件上传)

    在实现文件上传功能时,必须注意安全性问题,如防止跨站脚本攻击(XSS)、路径遍历攻击等。确保对上传文件的类型、大小进行限制,并正确处理文件名,避免潜在的安全风险。 通过以上步骤,你就可以在Java Web项目中...

    .net ckeditor + ckfinder 实现上传

    这篇详细讲解将围绕如何在.NET平台上集成CKEditor和CKFinder来实现文件上传功能。 首先,CKEditor是一款强大的开源富文本编辑器,它提供了丰富的文本格式化选项、图片插入、链接创建等功能,使用户可以在网页上进行...

    ckeditor和ckfinder实现asp.net图片上传的功能

    这通常涉及到创建一个处理CKFinder上传请求的控制器或页面。例如,创建一个名为`CKFinderUpload`的Action,处理文件上传逻辑。 5. **安全性考虑**:为了防止非法文件上传和安全问题,你需要在后台代码中添加验证和...

    ckfinder-java/jsp版

    官方没有给出ckfinder的jsp的版本,而自己最近要在一个java项目中想使用ckfinder,因此就自己做了一个。这个是参照官方的PHP版本来做的,因为时间仓促和受PHP编程的影响,代码写得一团糟(真丢人)。本来想重新整理...

    CKEditor FCKEditor 使用-集成 CKFinder(上传文件、浏览文件)

    1. **上传文件**:用户可以通过 CKFinder 直接将本地文件上传到服务器,然后在编辑器中使用这些文件,如图片或文档。 2. **浏览文件**:它提供了一个文件管理系统,让用户可以在服务器上查看和选择文件,方便插入到...

    ckeditor与ckfinder(java版)整合,实现图片上传

    ### CKEditor与CKFinder(Java版)整合实现图片上传的知识点 #### 1. CKEditor配置详解 **下载与安装** - **下载地址**: [http://ckeditor.com/download](http://ckeditor.com/download) - **安装步骤**: - 解压...

    CkEditor+CKFinder+实现本地图片上传

    第一步:网站需要引用CKFinder的dll(目录:/CKFinder/bin/Release/CKFinder.dll) 第二步:配置CKEditor的config.js (目录:/CKEditor/config.js ) 在CKEDITOR.editorConfig函数里加上,不需要的功能可以去掉 ...

    asp使用ckeditor和ckfinder上传图片设置

    在asp中使用ckeditor开启图片上传功能的设置方法: 1、下载asp版本的ckfinder,放到ckeditor目录下 2、修改ckeditor\config.js,加上如下内容: CKEDITOR.editorConfig = function( config ) { config.scayt_...

    ckeditor+ckfinder配置实现图片上传实例

    在本文中,我们将深入探讨如何使用CKEditor和CKFinder配置一个图片上传的实例。CKEditor是一款功能强大的在线文本编辑器,而CKFinder则是一个与之配套的文件管理器,允许用户方便地上传、管理和选择图片或其他文件。...

    ssm+ckfinder,图片,文件管理

    6. **自定义功能扩展**:CKFinder允许开发者根据需求进行定制,比如添加权限控制、实现文件的水印、缩略图生成等。 7. **部署与测试**:完成集成后,需要在服务器上部署项目,并进行功能测试,确保图片和文件的上传...

    ckfinder的java实现

    CKFinder是一款功能强大的文件管理和上传工具,主要用于Web应用程序,它提供了用户友好的界面,使得用户能够轻松地浏览、上传、下载、删除和管理服务器上的文件和图片。CKFinder通常与富文本编辑器CKEditor一起使用...

    jsp项目中使用了ckfinder+ckeditor

    而CKFinder则是一个文件管理器,它与CKEditor配合使用,可以方便地上传、选择和管理网页中的图片、文件和视频等资源。CKFinder提供了一个直观的界面,允许用户浏览服务器上的文件夹结构,选择合适的文件进行插入或...

    CKFinder所需jar包

    CKFinder是一款功能强大的Web文件管理器,它使用Ajax技术提供了流畅的用户界面,使得在Web上浏览、上传、编辑和管理文件变得极其便捷。这款工具广泛应用于网站后台、CMS(内容管理系统)以及需要用户交互式文件操作...

Global site tag (gtag.js) - Google Analytics