UEditor1.4.3-for-Yii1-扩展

2015.2.2 update:

更新了一个版本，github地址：https://github.com/xbzbing/yii1-ueditor 。

新版本配置更为方便、直观，但与之前版本不兼容。

推荐更新，参考 [更新]UEditor1.4.3-for-Yii1-扩展。

大概五月初UEditor升级了新版本，不过直到五月底我才知道这事，赶紧看了看新版本的Demo，发现做了好多改变。

从前端上看，我最讨厌的swfuploader终于消失了，取而代之的是百度团队开发的webuploader插件。虽然在低版本浏览器会自动切换成swf上传，但是我也没打算支持低版本，所以挺好～多了图片和附件文件在线查看还不错，这些新特性我都很喜欢，看来值得升级。

也得庆幸我是月底才知道，从正式发布1.4.0到月底发布了1.4.3，中间产生了无数bug，代码的结构也在不断的变化， 我看到的时候是1.4.2，开发的时候各种蛋疼，一天后就更新了1.4.3，百度前端团队还是很给力的。

较之1.3.x版本，前端除了上传组件外其余改变不大，而后端则是做了较大的调整，可以说是与之前完全不兼容。新版本的后端采用了统一后端入口，动态加载上传配置（即config接口，其实从上次的1.3.6的fetch方法就能看出来他们想这么做），并支持回调，可以说UEditor真的在朝着大而全的宇宙第一编辑器的目标去了。。。。。

总而言之，值得升级， 于是写成了新的UEditor1.4.3-for-Yii1-扩展。

github地址：https://github.com/xbzbing/yii1-ueditor

参考：http://www.crazydb.com/archive/百度编辑器UEditor的Yii扩展

一点说明

• 支持上传图片自动生成缩略图，默认开启该功能，默认缩略图大小200×200。这里使用了ThinkPHP的图片处理类。生成的缩略图名字是「原图片.thumbnail.扩展名」的形式。在线图片管理部分仅显示缩略图，但是点击插入的时候插入原图。

• 支持水印，默认关闭该功能。开启只要配置controller的watermark为水印图片的「相对路径」即可。缩略图不带水印。

• 扩展中包含了UEditor的源码，在resources目录，使用Yii的asset机制来发布。因此不必单独引入UEditor的文件，扩展会自动处理路径关系。

• 支持同一个页面多个UEditor实例，请在使用widget时配置name属性来指定生成的ueditor对象。
  

• 当前使用的UEditor版本是1.4.3，支持的Yii版本的是1.1.14。「理论上」支持UEditor升级，可以直接把升级文件覆盖到resources目录。支持单独引入patch，配置widget的jsFiles属性即可。

使用方法

1、将ueditor放在项目的/protected/extensions/目录下。

2、在config.php中配置controllerMap，来指定ueditor的访问路径。

'controllerMap'=>array(
    'ueditor'=>array(
        'class'=>'ext.ueditor.UeditorController',
    ),
),

可选配置

'controllerMap'=>array(
    'ueditor'=>array(
        'class'=>'ext.ueditor.UeditorController',
        'config'=>array(),//参考config.json的配置，此处的配置具备最高优先级
        'thumbnail'=>true,//是否开启缩略图，默认为true
        'watermark'=>'',//水印图片的地址，使用相对路径
        'locate'=>9,//水印位置，1-9，默认为9在右下角
    ),
),

其中config配置优先使用main.php中的配置，没有配置的部分使用默认的default配置，最后使用ueditor的php/config.json文件中的配置。

3、在view中使用widget。 在原有的view中添加即可，注意id填写为原有的textarea的id。 注意，使用这个widget时，不要删除原有的代码，只要添加此处的代码即可。

$this->widget('ext.ueditor.UeditorWidget',
        array(
                'id'=>'Post_content',//页面中输入框（或其他初始化容器）的ID
                'name'=>'editor',//指定ueditor实例的名称,个页面有多个ueditor实例时使用
        )
);

如果同一个页面要使用多个UEditor，必须设置name参数来指定生成的ueditor对象的名称。

4、错误排查

• 出现错误请查看上传目录的权限问题。

• 默认上传到「应用」根目录（不是网站根目录）的upload/目录。

• 不要开启Yii的调试，因为UEditor的返回都是json格式，开启调试会导致返回格式不识别。

• 如果出现后端配置不正确的提示，请使用浏览器调试工具查看具体返回值，或者访问config响应地址，/ueditor/index?action=config，查看请求返回。一般出现这种情况有两种可能：1、开启了Yii调试，或者使用了yii-debug-toolbar之类的插件导致返回格式不识别。2、没有配置controllerMap。

• 非常遗憾依然不支持Yii的CSRF防御机制，虽然Ueditor1.4+支持了「自定义请求参数」的功能（参考http://fex.baidu.com/ueditor/#server-server_param，非常好的功能，可以用于解决swf上传的身份维持功能，如果1.3.6中也有这个，就不用修改ueditor的文件了），但是该请求参数是通过GET方式提交，而Yii的CSRF是从POST/PUT/DELETE方法中获取，因此还是不能正常使用。如果有需求，请自行修改controller。

• 出现 TypeError: 'null' is not an object (evaluating 'b.style') 等类似的错误，说明当前页面没有指定id的元素。这个widget只是注册JS，把原有的textarea表单变成UEditor编辑器，因此请不要删除原有的输入框。

github地址：https://github.com/xbzbing/yii1-ueditor