在 PHP 里 使用 CKEditor 和 CKFinder 插件上傳圖片.
1. 下載安裝 CKEditor:
http://ckeditor.com/
解壓下載到的CKEditor放到網(wǎng)站的路徑中即可
2. 下載安裝 CKFinder:
http://ckfinder.com/download
解壓下載到的CKEditor放到與CKEditor同一目錄中即可
3. 在網(wǎng)頁中使用 CKEditor 和 CKFinder:
CKEditor 實際是替換一個 textarea 標(biāo)簽，所以把textarea放到一個form中，當(dāng)提交到php服務(wù)器端，使用$_GET['xxx'] 或者 $_POST['xxx'] 取得編輯好的數(shù)據(jù)。注意，因為 CKEditor 要替換 textarea，所以相應(yīng)的javascript 代碼"CKEDITOR.replace(xxxxxx)" 要放在 textarea 的后面。
最簡單的方法，直接使用下面的例子修改一下即可。可以在網(wǎng)頁中看到 CKEditor 了，興奮吧。
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8">
<title>CKEditor</title>
</head>
<body>
<form action="b.php" method="post">
<textarea name="editor1">CKEditor Demo</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>
4. 配置CKFinder進(jìn)行上傳圖片，F(xiàn)lash等。
到這里，點擊 "Image" 按鈕，在彈出的窗口中的 "Upload" 標(biāo)簽中已經(jīng)看到上傳按鈕了，但是在上傳文件時失敗。因為CKFinder還沒有配置好。需要創(chuàng)建上傳文件的目錄和修改 ckfinder/config.php 里的三個地方:
a. 創(chuàng)建保存上傳文件的目錄，如uploads，
其路徑為/Users/Biao/Sites/php/uploads/
[For Linux: 把其權(quán)限設(shè)置為php server可讀寫，最簡單的是 chmod 777 uploads
這樣php server才有權(quán)限往里面保存文件.]
b. 找到配置文件第32行，把 function CheckAuthentication() { return false; }
修改成 function CheckAuthentication() { return true; }
c. 找到第63行，把 $baseUrl 的值改成保存上傳文件存目錄的URL，
如 $baseUrl = '/~Biao/php/uploads/';
怎么取得這個 URL 呢？其實很簡單，在這個uploads文件夾里創(chuàng)建一個簡單的path.php文件：
<?php echo $_SERVER["PHP_SELF"] ?>，然后從瀏覽器里訪問，
就可以得到 /~Biao/php/uploads/path.php，
則 uploads 文件夾的URL是 /~Biao/php/uploads/
d. 找到第82行，刪除 $baseDir = resolveUrl($baseUrl); 修改 $baseDir 為上傳文件目錄的絕對路徑，
如$baseDir = '/Users/Biao/Sites/php/uploads/';
這是因為resolveUrl($baseUrl)函數(shù)不能正常工作。
至此，可以使用 CKEditor 和 CKFinder 上傳文件了。
對上面這個小例子中服務(wù)器端的b.php代碼：
<?php
header("Content-Type:text/html; charset=utf-8");
$str = $_POST['editor1'];
echo $str;
?>
可以看到，在點擊submit按鈕后，服務(wù)器端收到了CKEditor中的內(nèi)容，并使用echo輸出，生成一個與CKEditor里面編輯的完全一樣的內(nèi)容。在服務(wù)器端可以把收到的內(nèi)容保存到數(shù)據(jù)庫中。然后再讀出在相應(yīng)的頁面顯示出來。
CKEditor 界面:
上傳界面: