2019年1月

百度编辑器 ueditor 增加缩略图及水印功能

Ueditor默认是不带水印功能的,但有时候网站运营需要编辑器自带水印来提高工作效率,于是我也试着摸索出了一套方法。在实现我自己的方法之前,也看了其他人的实现方法:修改 Uploader.class.php,新增水印方法,网上能找到的基本都是这类方法(参考链接),其实也挺好,只是过程稍显复杂,我希望能更简单些。

在仔细研究了ueditor关于图片上传部分的代码后,我发现,只需要在php文件返回json数据之前对原图片进行处理即可实现水印功能,代码如下:

在此要特别感谢 PicThumb.class.php 作者,这是一个开源图片处理库,包括缩放、裁剪、水印等,使用起来方便简单,我的方法里就引用了该文件
// 文件路径 ueditor/php/action_upload.php
// ...
require /path/to/PicThumb.class.php;
// ...

$fileinfo = $up->getFileInfo();

/*
 * 水印处理
 */
// 判断是图片上传(包括单图和多图),不是视频、文件
if (htmlspecialchars($_GET['action']) == 'uploadimage') {
    $abPath = $_SERVER['DOCUMENT_ROOT'];
    $abPath = rtrim($abPath, '/') . '/';
    
    // 根据后台的相关设置,配置PicThumb相关参数 
    if (class_exists('PicThumb')) {
        $params = array(
            'type' => $_COOKIE['thumbtype'],                // fit/crop 缩放、裁剪
            'width' => $_COOKIE['thumb_w'],                 // 目标图宽度
            'height' => $_COOKIE['thumb_h'],                // 目标图高度
            'watermark' => $abPath . $_COOKIE['watermark'], // 水印图片
            'gravity' => $_COOKIE['imgposition']            // 水印位置
        );
        $thumbobj = new PicThumb();
        $thumbobj->set_config($params);
    } //. end
    
    $filename_arr = explode('/', $fileinfo['url']);
    $ym = date('Ymd');
    $filename = end($filename_arr);
    
    // 判断后台设置判断是否需要生成缩略图和水印
    if ($_COOKIE['imgscale'] || $_COOKIE['imgwater']) {
        $flag = $thumbobj->create_thumb($abPath . 'uploadfile/' . $ym . '/' . $filename, $abPath . 'uploadfile/' . $ym . '/thumb' . $filename);
        if ($flag) {
            $fileinfo['url'] = '/uploadfile/' . $ym . '/thumb' . $filename;
        }
    }
}

/*
 * 水印处理完成
 */

/* 返回数据 */
return json_encode($fileinfo);

通过ueditor的配置文件可以限制上传图片大小,但由于配置文件是.json格式,不便于动态设置,所以一并通过PicThumb 库实现图片缩放也是很好的办法。