JSP使用ckfinder實現Ajax文件上傳

時間 2019-12-07

標籤 jsp 使用 ckfinder 實現 ajax 文件上傳欄目 JSP 简体版

原文原文鏈接

一、下載ckfinderjavascript

ckfinder官網下載Java版本的ckfinder。html

二、解壓文件java

解壓下載的zip文件，解壓後的目錄下有CKFinderJava.war文件，把該文件放入Tomcat的webapp目錄下，啓動Tomcat,Tomcat的webapp目錄下會生成CKFinderJava文件夾。 web

三、配置java web項目瀏覽器

(1).複製WEB-INF目錄下的config.xml文件到你的項目WEB-INF目錄下，並修改以下兩處session

<enabled>false</enabled>修改成<enabled>true</enabled>app

<baseURL>/CKFinderJava/userfiles/</baseURL>其中CKFinderJava爲你的項目名稱webapp

(2).複製lib裏的全部jar文件jsp

把CKFinderJava文件夾裏的WEB-INF\lib目錄下的全部jar文件複製到本身的Web項目的WEB-INF\lib目錄下。ui

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

打開CKFinderJava文件夾裏的WEB-INF目錄下的web.xml文件，並把如下的代碼複製到本身的Web項目的WEB-INF目錄下的web.xml文件中。在web.xml中增長以下片斷：

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>

四、把ckfinder文件加入WEB項目

CKFinderJava文件夾下的ckfinder文件夾複製到WEB項目的WebContent文件夾下

五、在JSP中使用ckfinder

JSP使用ckfinder代碼以下：

Html代碼

<%@ 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>

六、把WEB項目部署到Tomcat，而後啓動Tomcat，在瀏覽器中輸入你的jsp訪問地址,如：http://localhost:6060/CKFinderJava/index.jsp，效果圖以下：

相關標籤/搜索