Heim  >  Artikel  >  php教程  >  PHP中Ckeditor+Ckfinder配置图片上传功能

PHP中Ckeditor+Ckfinder配置图片上传功能

WBOY
WBOYOriginal
2016-06-13 10:01:14903Durchsuche

从标题来看我们知道Ckeditor不支持图片上传功能,它是需要一个组件Ckfinder才可以支持上传图片, 本文章就来详细的介绍了如何配置Ckeditor+Ckfinder实现图片上传的功能。

第一:安装配置CKEditor

在扩展CKfinder实现图片上传之前,我们先把最基本的CKeditor编辑器安装一下。

1.  将下载的ckeditor_3.4.2.zip解压,复制目录下的ckeditor文件夹至所需目录,如/admin/。

第一:安装配置CKEditor ,可改/admin/ckeditor/ckeditor.js来配置编辑器,如字体、背景色、语言

、界面高宽、编辑器按钮分布等

 代码如下 复制代码
config.language = 'en';
config.skin = 'v2';
config.uiColor = '#AADC6E';
config.toolbar = 'Basic';

….
2、官方的demo大多都喜欢用js配置editor区域,习惯写php的我就嫌麻烦,只好看内置的php类。

 代码如下 复制代码

require_once ROOTPATH . "ckeditor/ckeditor.php";
$CKEditor = new CKEditor();
$CKEditor->returnOutput = true; //设置输出可用变量的情况
$CKEditor->basePath = '/ckeditor/';//设置路径
$contentarea =  $CKEditor->editor("content", $rs['contents']); //生成一个以name为content的

textarea
 
echo $contentarea;

页面引用CKeditor,关键代码如下

 

 代码如下 复制代码


第二步,我们来配置安装CKfinder

CKfinder是官方组件,下载地址如下:http://ckfinder.com/download (注意:与ckeditor不是同一

网站)。

1.  将下载的ckfinder_php_2.0.1.zip 解压,复制目录下的ckfinder文件夹至编辑器目

录,/admin/ckeditor。

2、需要上传了 ,只好加入ckfinder。把ckfinder和ckeditor放在同级目录下。
打开/ckfinder/config.php,  首先设置第一个函数CheckAuthentication(),这个函数需要按照自己的

规则写,只要return  true的情况才能允许上传文件到服务器的,当然不建议直接写return true,这

将导致安全问题。可以采用session来处理比较方便。
我们可以简单的把子

config.php这样修改

 代码如下 复制代码

function CheckAuthentication()
{

return false;//改为return false
}

或者更安全的做法利用session 关于session用法 [用力点击]

 代码如下 复制代码

session_start();
function CheckAuthentication(){
    if(isset($_SESSION['UseEidtor']))
        return true;
    else
         return  false;
}

找到”$baseUrl”,这个变量定义了ckfinder文件上传的目录,将值设为”$baseurl=’../data /’,

文件上传后程序他会在此目录下自动建立相应的文件夹如image、flash等。

第三:整合,实现图片上传功能

1.  在编辑器页面头部引用ckfinder.js文件,代码如下:

 代码如下 复制代码

 


下介绍两调用方法一种php

最后就是使用ckfinder

 代码如下 复制代码

require_once ROOTPATH . "ckeditor/ckeditor.php";
    require_once ROOTPATH . 'ckfinder/ckfinder.php' ;
   
     $CKEditor  = new  CKEditor();
    $CKEditor->returnOutput = true;
    $CKEditor->basePath = '/ckeditor/';
 
    CKFinder::SetupCKEditor($CKEditor, '/ckfinder/') ;//注意这里是相对路径,相对于根目录,

不能用绝对路径
 
    $contentarea =  $CKEditor->editor("content", $rs['contents']);


另一种js或html页面的修改

 代码如下 复制代码

command=QuickUpload&type=Files',
filebrowserImageUploadUrl : 'ckeditor/ckfinder/core/connector/php/connector.php?

command=QuickUpload&type=Images',
filebrowserFlashUploadUrl : 'ckeditor/ckfinder/core/connector/php/connector.php?

command=QuickUpload&type=Flash'
});

这样就大功告成了,有想知道Ckeditor Ckfinder配置图片上传功能支持javascript html和php调用的朋友可以参考一下本教程

本站原创教程转载注明来源:http://www.bKjia.c0m/phper/php.html

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn