准备                                                                                                                                                                

  CKEditor&&CKFinder破解版百度网盘地址:http://pan.baidu.com/s/1qWsDPKC       密码:yydcdut

   

  将CKEditor和CKFinder放在同一文件夹下。

CKEditor实现编辑框                                                                                                                                        

  CKEditor 实际是替换一个textarea标签,所以把textarea放到一个form表单中,当提交到php服务器端,使用$_POST['xxx'] 取得编辑好的数据。

  修改CKEditor的配置文件config.js

 CKEDITOR.editorConfig = function( config )
{
config.language = 'zh-cn';
config.uiColor = '#FFA';
config.skin = 'v2';
config.width = 850;
config.height = 400;
config.toolbar = 'Full';
};

  一个简单的网页实现

 <html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8">
<title>yyd</title>
</head>
<body>
<form action="post.php" method="post">
<textarea name="editor1">yyd</textarea>
<input type="submit" name="submit" value="Submit" />
</form>
</body> <script src="ckeditor/ckeditor.js"></script>
<script type="text/javascript">
// 启用 CKEitor 的上传功能,使用了 CKFinder 插件
CKEDITOR.replace( 'editor1', {
filebrowserBrowseUrl : 'ckfinder/ckfinder.html',
filebrowserImageBrowseUrl : 'ckfinder/ckfinder.html?Type=Images',
filebrowserFlashBrowseUrl : 'ckfinder/ckfinder.html?Type=Flash',
filebrowserUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
filebrowserImageUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images',
filebrowserFlashUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash'
});
</script>
</html>

  实现截图

        

CKFinder实现上传图片                                                                                                                                    

  • 在与CKEditor和CKFinder同目录下创建uploads文件夹
  • 改修config.php文件

  第行的函数

 function 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 isset($_SESSION['IsAuthorized']) && $_SESSION['IsAuthorized']; // ... where $_SESSION['IsAuthorized'] is set to "true" as soon as the
// user logs in your system. To be able to use session variables don't
// forget to add session_start() at the top of this file. //return false;
return true;
}

  第行,即修改为创建的uploads路径

 $baseUrl = '/CK/plugins/uploads/';

  实现截图

    

  创建post.php文件,将传递过来的POST打印出来

 <?php
header("Content-Type:text/html; charset=utf-8");
$str = $_POST['editor1'];
$data = stripslashes(htmlspecialchars_decode($str));
echo $data;
?>

    

总结和问题的解决                                                                                                                                           

  当我配置完成后,submit提交之后死活都不能显示图片,查看源代码的时候,发现双引号被转义了,觉得很蛋疼。我不知道这个CKEditor转义的还是浏览器转义的,因为就在前几天,我在测试SQL注入的时候就发现明明可以注入的,但死活不出来结果,然后在本机上将password传递过去的值打印出来了,发现是被转义了,表示很蛋疼。所以我在这里用了$data = stripslashes(htmlspecialchars_decode($str));将转义之后再反转义湖区,结果就OK了。

  CKEditor&&CKFinder组合不仅可以上传图片,还可以上传文件等。

转载请注明出处:http://www.cnblogs.com/yydcdut/p/3518102.html

CKEditor && CKFinder 配置的更多相关文章

  1. 网络编辑器插件ckeditor+ckfinder配置

    原帖地址 另外一个 去掉编辑器的下边栏 在config.js中加入: config.removePlugins = 'elementspath'; config.resize_enabled = fa ...

  2. (配置)CKEditor+CKFinder+php上传配置,根据年月命名创建文件夹来存放

    CKEditor+CKFinder+php上传配置 新版本的CKEditor只提供了基本的文本编辑功能,上传模块由另一个组件CKFinder.这里主要记录CKFinder上传的一些参数配置,能够成功上 ...

  3. CKEditor + CKFinder 实现编辑上传图片配置 (二)

    CKEditor + CKFinder 实现编辑上传图片配置 (二) 上传图片时,如果上传的图片过大,默认情况情况下回自动裁剪,代码如图 \ckfinder\config.php 目录下的配置文件co ...

  4. CKEditor + CKFinder 实现编辑上传图片配置

    下载最新版 ckfinder 本人下载的php版本 https://cksource.com/ckfinder/download 下载最新版ckeditor http://ckeditor.com/ ...

  5. CKEditor使用配置方法

    一.使用方法: 1.在页面<head>中引入ckeditor核心文件ckeditor.js <script type="text/javascript" src= ...

  6. jsp中如何整合CKEditor+CKFinder实现文件上传

    最近笔者做了一个新闻发布平台,放弃了之前的FCKEditor编辑器,使用了CKEditor+CKFinder,虽然免费的CKFinder是Demo版本,但是功能完整,而且用户都是比较集中精神发新闻的人 ...

  7. 在ASP.NET项目中使用CKEditor +CKFinder实现图片上传功能

    前言 之前的项目中一直使用的是FCKeditor,昨天突然有个想法:为什么不试一下新的CKEditor呢?于是花了大半天的时间去学习它的用法,现在把我的学习过程与大家分享一下. 谈起FCKeditor ...

  8. ckeditor的配置及使用

    一.使用方法:1.在页面<head>中引入ckeditor核心文件ckeditor.js<script type="text/javascript" src=&q ...

  9. .Net在线编辑器:KindEditor及CkEditor+CkFinder配置说明

    Net在线编辑器:KindEditor及CkEditor+CkFinder配置说明 一.KindEditor(免费) KindEditor是一套开源的HTML可视化编辑器,主要用于让用户在网站上获得所 ...

随机推荐

  1. CSS基础-DAY2

    CSS属性操作-文本 文本颜色 <head> <style> p{ /*color:#8B5742 ;色码表*/ color: RGBA(255,0,0,0.5); /*调色, ...

  2. iOS Sprite Kit教程之场景的切换

    iOS Sprite Kit教程之场景的切换 Sprite Kit中切换场景 每一个场景都不是单独存在的.玩家可以从一个场景中切换到另外一个场景中.本小节,我们来讲解场景切换.在每一个游戏中都会使用到 ...

  3. Python实现QQ自动点赞

    用Python做一个QQ自动点赞神器,上代码: 1 def QQZan(qq): 2 browser = webdriver.Chrome() 3 browser.maximize_window() ...

  4. [ 转载 ] Java基础4--Java中的static关键字解析

    Java中的static关键字解析 static关键字是很多朋友在编写代码和阅读代码时碰到的比较难以理解的一个关键字,也是各大公司的面试官喜欢在面试时问到的知识点之一.下面就先讲述一下static关键 ...

  5. 线性表之顺序栈C++实现

    线性表之顺序栈 栈是限定仅在表尾(栈顶)进行插入删除操作的线性表,FILO:先进后出 一.顺序栈的头文件:SeqStack.h //顺序栈头文件 #include<iostream> us ...

  6. 移动端适配之REM

    随着手机等移动设备的普及,移动端带来的流量已经不可忽视,一个网站不只是只有pc的页面就足够了,移动端的适配已经势在必行.但是移动设备种类繁多,屏幕尺寸也千奇百怪,能不能找到一种方式可以适配所有的手机屏 ...

  7. 多线程_java多线程环境下栈信息分析思路

    导读:Java多线程开发给程序带来好处的同时,由于多线程程序导致的问题也越来越多,而且对问题的查找和分析解决对于菜鸟程序原来是是件头疼的事.下面我就项目中使用多线程开发程序过程中遇到的问题做详细的分析 ...

  8. 小程序在wxml页面中取整

    小程序无法像html中,在页面中直接parseInt() index.wxml {{price | Int}} 小程序还有另一种处理方法 wxs 是一种类似于js脚本的东西 filters.wxs v ...

  9. 重温JavaScript获取CSS样式的方法(兼容各浏览器)

    众所周知,CSS样式有三种类型:行内样式.内部样式和外部样式,JavaScript获取CSS样式时分为两种情况:行内样式获取法 和 非行内样式获取法 . 一.行内样式获取相对简单,通过element. ...

  10. hdu 1847 博弈基础题 SG函数 或者规律2种方法

    Good Luck in CET-4 Everybody! Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K ...