准备
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组合不仅可以上传图片,还可以上传文件等。