使用ThinkPHP上傳類處理KindEditor上傳的圖片

KindEditor做爲一款可視化的HTML編輯器用起來確實比較方便,其自己也自帶了圖片上傳的處理
這裏修改成TP上傳處理圖片,是爲了保證上傳圖片的方便(目錄獨立於編輯器,便於增長水印等處理)

第一步：在模板html頁面引入以下文件：

 

<link rel="stylesheet" href="/data/editor/plugins/code/prettify.css" />
<script charset="utf-8" src="/data/editor/kindeditor.js"></script>
<script charset="utf-8" src="/data/editor/lang/zh_CN.js"></script>
<script charset="utf-8" src="/data/editor/plugins/code/prettify.js"></script>
<script>
	KindEditor.ready(function(K) {
		var editor1 = K.create('textarea[name="content"]', {
			cssPath : '/data/editor/plugins/code/prettify.css',
			uploadJson : "/Home/Common/upload",//圖片上傳後的處理地址
		});
		prettyPrint();
	});
</script>

路徑根據本身的項目不一樣,正確引入便可,uploadJson : "/Home/Common/upload",
uploadJson後面的就是編輯器上傳圖片的處理地址，能夠根據本身的自行配置
這裏交由Home分組的Common控制器的upload方法處理圖片上傳

第二步:自定義上傳處理函數

 

 

function upload(){	
	header("Content-Type:text/html;charset=utf-8");
    import('ORG.Net.UploadFile');

    $upload = new UploadFile();
	$upload->maxSize  = 3145728;
	$upload->allowExts  = array('jpg', 'gif', 'png', 'jpeg');
	
	$upload->autoSub=true;
	$upload->subType='date';
	$upload->dateFormat='Ym';	
	$upload->savePath =  './upload/article/';
	
	if(!$upload->upload()){
		$error['error']=1;
		$error['message']=$upload->getErrorMsg();
		exit(json_encode($error));
	}
	
	$info=$upload->getUploadFileInfo();
	
	/*圖片水印處理
	import('ORG.Util.Image');
	$image = new Image();
	$image->water($upload->savePath.$info[0]['savename'],'./data/water.png');*/
	
	$data=array(
		'url'=>str_replace('./','/',$upload->savePath).$info[0]['savename'],
		'error'=>0
	);
	
	exit(json_encode($data));		
}

這裏使用ThinkPHP的上傳類處理圖片上傳,也能夠本身寫，惟一須要注意的就是返回的格式

查看了下官方的文檔:
上傳正確返回這種JSON串
{
    "error" : 0,
    "url" : "http://www.example.com/path/to/file.ext"
}
上傳失敗返回這種JSON串
{
    "error" : 1,
    "message" : "錯誤信息"
}

特別須要注意的一點就是返回的error必定要用整數1或是0,別用字符串'1'或'0'
緣由是plugins/image/image.js的結果判斷是 恆等於 ===
(當初本身就是由於PHP端返回的是字符串形式的'0'不等於整數的0致使上傳以後老是彈窗報錯)