UE移植到SAE云平台

  应用架在新浪的SAE上,而同时功能中又需要用上编辑器,鉴于百度的UEditor功能强大,可定制,文档全,所以理所当然的用它。而新浪把本地文件的IO操作禁止了,使得UEdiotr的图片上传、附件和在线涂鸦功能都不可用了。发布文章是不能够上传图片和附件 的,只能采用网络图片,甚至自己先将图片和附件上传到云上,然后再超链接使用,虽然也可以解决问题,但是挺不痛快的。后来随着对SAE有了更深入的了解之后,发现新浪提供了Storage来支持文件上传,下面我就利用SAE的Storage对UEditor进行简单的修改,同时不影响以后的使用。

1、首先在Storage中创建一个名为"upload"的domain;

2、找到UEditor中处理上传功能的文件上传类;

我用的UEditor版本是最新的1.2.3.0 PHP版本,在这个版本中,官方提供的PHP上传功能都统一通过调用ueditor/php/Uploader.class.php 里的Uploader来实现。打开该文件,在构造函数中我们看到upFile这个函数被调用来实现上传。注意到upFile里面的这部分代码,大概第91行至97行处:

1 $this->fullName = $this->getFolder() . '/'. $this->getName();
2 if( $this->stateInfo == $this->stateMap[ 0 ] ) {
3     if(!move_uploaded_file($file[ "tmp_name"],$this->fullName)) {
4         $this->stateInfo = $this->getStateInfo( "MOVE");
5     }
6 }
  显然move_upload_file是不能用了,SAE提供了SaeStorage这个类来处理用户上传的文件,具体见该类文档:http://apidoc.sinaapp.com/sae/SaeStorage.html

我们把上面代码改成下面这个样子:

 1 $this->fullName = $this->getFolder() . '/'. $this->getName();
 2 if( $this->stateInfo == $this->stateMap[ 0 ] ) {
 3     if(!defined('SAE_TMP_PATH')){
 4         if( !move_uploaded_file( $file[ "tmp_name"] , $this->fullName ) ) {
 5             $this->stateInfo = $this->getStateInfo( "MOVE");
 6         }
 7     }
 8     else{
 9         $st=newSaeStorage();
10         $url=$st->upload('upload',$this->fullName, $file[ "tmp_name"]);
11         if(!$url){
12             $this->stateInfo = $this->getStateInfo( "MOVE");
13         }
14         else{
15             $this->fullName=$url;
16         }
17     }
18 }

  说 明:SAE_TMP_PATH是SAE平台上自动定义的常量,我们用它来判定是否是在SAE上(因为还要兼容其他开发环境),如果在SAE上,生成一个 SaeStorage对象,调用upload这个API,第一个参数是在SAE的Storage里创建的Domain,第二个参数是保存的文件名(可以包 含目录,如果目录不存在,Storage会自动创建),第三个参数则是文件的临时名。当图片上传成功后会返回图片的URL,我们直接 令$this->fullName=$url;这样程序就能返回图片的完整地址给UEditor了。

上面代码的第一行调用了getFolder,该方法源代码如下:

 1 privatefunctiongetFolder()
 2 {
 3     $pathStr= $this->config[ "savePath"];
 4     if( strrchr( $pathStr, "/") != "/") {
 5         $pathStr.= "/";
 6     }
 7     $pathStr.= date( "Ymd");
 8     if( !file_exists( $pathStr) ) {
 9         if( !mkdir( $pathStr, 0777 , true ) ) {
10         returnfalse;
11         }
12     }
13     return$pathStr;
14 }

如果你有了解SAE上禁用函数和类,那你自然清楚mkdir在SAE上是不能用的!没关系,Storage它会自动帮我们创建目录,要对此做下改动,代码如下所示:

 1 privatefunctiongetFolder()
 2 {
 3     $pathStr= $this->config[ "savePath"];
 4     if( strrchr( $pathStr, "/") != "/") {
 5         $pathStr.= "/";
 6     }
 7     $pathStr.= date( "Ymd");
 8     if(!defined('SAE_TMP_PATH'))
 9     {
10         if( !file_exists( $pathStr) ) {
11             if( !mkdir( $pathStr, 0777 , true ) ) {
12                 returnfalse;
13             }
14         }
15     }
16     return$pathStr;
17 }

3、在editor_config.js中把所有的图片修正地址都改成""。

现 在我们传个图片试试,在Storage里面也能看到上传的文件,那说明文件成功上传了,但是在编辑器里面无法显示却裂了。看看链接的地址,原来 UEditor给我们的地址自动加上了图片修正地址。在editor_config.js中把所有的图片修正地址都改成"",如:

1 ,imagePath:""          //图片修正地址,引用了fixedImagePath,如有特殊需求,可自行配置
2 ,scrawlPath:""         //图片修正地址,同imagePath
3 ,catcherPath:""        //图片修正地址,同imagePath
4 ,imageManagerPath:""   //图片修正地址,同imagePath

然后清除缓存,重新上传个图片,这会编辑器中也能够显示图片。

posted @ 2015-06-12 10:12  赵亚飞  阅读(...)  评论(...编辑  收藏