时光邮局 - 邮递员大叔

接下来算是比较重要的一点了吧, 在SAE平台上, 把上传图片神马的给用起来~~

话说, 看了下1.2版本的UEditor, 发现比1.1.8版本多了挺好玩儿的功能啊~

插入图片和插入视频这两个按钮, 里面都增加了一个”搜索”的功能, 搜索之后的结果选中了就可以直接插入编辑框中, 嗯, 这个还是挺赞的~

其中视频搜索, 会自动解析视频的地址, 这个真心赞啊~

废话不多说, 进入正式环节

1. 去除图片的”在线管理”功能. (这玩意儿功能是挺好的, 但是又得改程序, 又可能有权限之类的问题, 还是不开放给用户好啦)

找到dialogs/image/image.html, 删除以下代码:

<span tabSrc="imgManager">在线管理</span>

2. 修改图片上传的php文件, 还是在相同的文件中, 找到如下代码:

url:'../../server/upload/php/imageUp.php',

另外, 1.1.8的版本中, 是这样的:

url:'../../server/upload/php/up.php',

找到这个server目录中的imageUp.php文件进行修改.

找到之后发现同级目录下, 总共是有3个文件的, 分别是fileUp, imageUp, snapImageUp.(1.1.8只有up.php) , 这三个文件, 顾名思义, 分别是用来处理文件上传, 图片上传, 截图上传的~

修改起来其实都比较类似, 我这儿还是只拿imageUp.php做个示例好了.

核心工作其实非常简单, 就是写一个新的php脚本, 用来替代原有的imageUp.php, 因为我是用的Thinkphp, 所以干脆直接把我的代码放出来吧

1) 修改以上的调用路径为:

url:'../../../../Pic/upload',

2) 写一个PicAction.class.php, 内容为:

<?php
class PicAction extends Action {
	public function upload()
	{
		//文件上传状态,当成功时返回SUCCESS，其余值将直接返回对应字符窜并显示在图片预览框，同时可以在前端页面通过回调函数获取对应字符窜
	    $state = "SUCCESS";

	    $title = htmlspecialchars($_POST['pictitle'], ENT_QUOTES);
	    $domain = C('PIC_UPLOAD_DOMAIN');
	    $path = C('PIC_UPLOAD_PATH');
	    $file = "";

	    //格式验证
	    $current_type = strtolower(strrchr($_FILES["picdata"]["name"], '.'));
	    if(!in_array($current_type, C('PIC_FILE_TYPE'))){
	        $state = "不支持的图片类型！";
	    }
	    //大小验证
	    $file_size = 1024 * C('PIC_FILE_SIZE');
	    if( $_FILES["picdata"]["size"] > $file_size ){
	        $state = "图片大小超出限制！";
	    }
	    //保存图片
	    if($state == "SUCCESS")
	    {
	    	$storage = new SaeStorage();
	    	$file = C('PIC_UPLOAD_PATH').uniqid().$current_type;
	    	$result = $storage->upload(C('PIC_UPLOAD_DOMAIN'),
	    		$file, $_FILES["picdata"]["tmp_name"]);
			if(!$result){
				$state = "图片保存失败！";
			}
			$file = $storage->getUrl($domain, $file);
	    }
		echo "{'url':'".$file."','title':'".$title."','state':'".$state."'}";
	}
}

?>

其中C(‘xx’)这样的配置, 就根据自己的需要进行修改吧~这段代码还是比较容易理解的…

嗯哪, 这就ok了…(貌似关键的地方稍微简略了一点啊!!)

3. 唔, 经过再次尝试, 发现上面漏了一处~

在1.2.0版本中的image.js, 或者是1.1.8版本中的image.html中, 找到如下代码:

tmpObj.data_ue_src = tmpObj.src = editor.options.imagePath + ci.url;

修改为:

tmpObj.data_ue_src = tmpObj.src = ci.url;

即, 针对storage中存储的图片, 直接使用返回的地址(即http://开头的绝对地址了)

wordImage目录, 即word粘贴后的image处理, 与image处理类似, 不过第3步的时候, 修改的是如下代码:

img.src = editor.options.imagePath + url.url;
img.setAttribute("data_ue_src", editor.options.imagePath + url.url);  //同时修改"data_ue_src"属性

同理, 也是将+前面的imagePath那一坨去掉即可~~

本文链接：https://www.poisonbian.com/post/159.html 转载需授权！