zoukankan      html  css  js  c++  java
  • CKEditor上传图片—配置CKFinder

    在网站开发中,如果有发布类似新闻的图文混排需求时,CKEditor不失为一个很好的选择,下载地址如下:[原文:http://www.cnblogs.com/leolis/archive/2012/08/29/2662357.html]

    http://ckeditor.com/download

    它的前身是FCKEditor,随着它的更新,上传图片的功能被分离出去了,现在如果需要实现上传图片,要么自己写代码,还有一种方法是使用CKFinder,下载地址如下:

    http://ckfinder.com/download

    下面详细描述一下使用它们的时候如何配置。

    CKEditor我下载的是3.6.4,CKFinder下载的是2.3 for ASP.NET,首先解压所有的文件,然后将ckeditor和ckfinder文件夹放到网站的目录下,可以删除ckeditor和ckfinder文件夹下的_samples、_source 文件夹,将CKFinder.dll添加到站点的bin/文件夹中,然后在网站页面头部添加js的引用,具体路径根据自己放置的路径设置,如下:

    <script src="../ckeditor/ckeditor.js" type="text/javascript"></script>
    <script src="../ckfinder/ckfinder.js" type="text/javascript"></script>
    

      在页面中添加一个textarea,具体代码如下:

    <textarea name="individual" id="individual" runat="server"></textarea>
    <script type="text/javascript">
        CKEDITOR.replace('individual');
    </script>
    

      接下来打开ckeditor文件夹下的config.js文件,在CKEDITOR.editorConfig = function (config) {};方法中添加如下代码:

    config.filebrowserImageBrowseUrl = '../editor/ckfinder/ckfinder.html?Type=Images';
    config.filebrowserFlashBrowseUrl = '../editor/ckfinder/ckfinder.html?Type=Flash';
    config.filebrowserUploadUrl = '../editor/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files';
    config.filebrowserImageUploadUrl = '../editor/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images';
    config.filebrowserFlashUploadUrl = '../editor/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash';
    config.filebrowserWindowWidth = '800';  //“浏览服务器”弹出框的size设置
    config.filebrowserWindowHeight = '500';

    上面的路径也需要根据自己的设置。

    然后打开ckfinder文件夹下面的config.ascx文件,为了所有的人都能看到服务器上上传文件夹里面的文件,将函数public override bool CheckAuthentication返回值改为true,其实也可以根据自身网站的安全需要去更改代码,这里只是为了简单实现,代码如下:

    public override bool CheckAuthentication()
        {
            // WARNING : DO NOT simply return "true". By doing so, you are allowing
            // "anyone" to upload and list the files in your server. You must implement
            // some kind of session validation here. Even something very simple as...
            //
            //        return ( Session[ "IsAuthorized" ] != null && (bool)Session[ "IsAuthorized" ] == true );
            //
            // ... where Session[ "IsAuthorized" ] is set to "true" as soon as the
            // user logs on your system.
    
            return true;
        }
    

      

    并且在public override void SetConfig()方法中找到BaseUrl,这个即为存放上传文件的路径,根据自己的网站进行更改。

     整个配置过程就是上面部分,现在可以进行测试了。

  • 相关阅读:
    TP5.1:request请求对象(使用四种方式获取)
    TP5.1:facade静态代理
    php:定义时间跳转到指定页面
    TP5.1:依赖注入、绑定一个类到容器里、绑定一个闭包到容器中
    sql:表中数据全部删除之后,重新插入时,从1开始增加
    通过CSS3实现:鼠标悬停图片360度旋转效果
    TP5.1 配置的获取与设置
    详细讲解:通过composer安装TP5.1(Thinkphp5.1)
    TP5.0: 显示错误信息
    socket2
  • 原文地址:https://www.cnblogs.com/xiashenbin/p/4157383.html
Copyright © 2011-2022 走看看