下载ckfinder :
http://cksource.com/ckfinder/download
下载下来 war包 放到tomcat 的webapps 下面运行一下,然后拿到ckfinder 文件夹 放到项目中
将tomcat 中 ckfinder下的 WEB-INF中 config.xml 拷贝到项目的WEB-INF 中 说下config.xml 的设置
<enabled>true</enabled><!-- 是否启动CKFinder,默认是false,需要手动改成true -->
<baseDir></baseDir><!-- 文件、图片存放的物理路径,会在指定路径下自动创建目录结构。最好不要设置,如果为空会在web应用根目录下创建对应的文件夹,如果设置在与CKEditor整合后根据URL找不到图片-->
<baseURL>/ck/userfiles/</baseURL><!-- 上传文件夹的URL配置,注意:需要添加发布的项目名,不添加则无法预览,添加错了则找不到文件 -->
<licenseKey></licenseKey>
<licenseName></licenseName>
<imgWidth>1600</imgWidth>
<imgHeight>1200</imgHeight>
<imgQuality>80</imgQuality>
<uriEncoding>UTF-8</uriEncoding>
<forceASCII>false</forceASCII>
在web.xml中添加支持CKFinder的Servlet。
<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的放置路径保持一致 -->
/plugin/ckfinder/core/connector/java/connector.java
</url-pattern>
</servlet-mapping>
页面上使用:
<script type="text/javascript" src="${webRoot}/plugin/ckfinder/ckfinder.js"></script>
<input type="text" class="form-control" id="url" >
<input type="submit" id="add" class="btn btn-default" onclick="BrowseServer()" value="选择图片">
<script>
function BrowseServer()
{
var finder = new CKFinder() ;
finder.basePath = '${webRoot}/plugin/ckfinder/'; //导入CKFinder的路径
finder.selectActionFunction = SetFileField; //设置文件被选中时的函数
// finder.selectActionData = inputId; //接收地址的input ID
finder.popup() ;
}
//文件选中时执行
function SetFileField(fileUrl,data)
{
document.getElementById("url").value = fileUrl ;
}
</script>
只是简单集成可用。具体的一些配置再看吧。
来源:https://blog.csdn.net/dxyzhbb/article/details/100777887