spring mvc 集成 ckfinder

下载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>
复制代码

只是简单集成可用。具体的一些配置再看吧。


原文地址:http://www.cnblogs.com/yqweber/p/3997413.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值