最近小二哥应运营要求,需在后台编辑器做图片添加水印功能,由于ueditor编辑器本身没有添加水印的功能;

所以小二哥参考了网上的一些方法,加上实现的步骤整理成文档,希望对需要的人有帮助。

1.打开ueditor目录下的php目录下的config.json 文件
在上传配置项添加下面代码:
"iswatermark": "true",

2.打开ueditor目录下的php目录下的action_upload.php文件,搜索代码:
a.
case 'uploadimage':
$config = array(
"pathFormat" => $CONFIG['imagePathFormat'],
"maxSize" => $CONFIG['imageMaxSize'],
"allowFiles" => $CONFIG['imageAllowFiles']
);
$fieldName = $CONFIG['imageFieldName'];
break;
在“break;”前添加:$watermark = $CONFIG['iswatermark']; 这句话就可以读取配置文件的"iswatermark"值了。
b.   继续在这个文件搜索代码:
$up = new Uploader($fieldName, $config, $base64);
把它改成:$up = new Uploader($fieldName, $config, $base64, $watermark); 这样就可以实例化Uploader类时带上$watermark变量。

3.打开ueditor目录下的php目录下的Uploader.class.php文件。
a.  在这个类里面添加“ private $water; //是否添加水印(属性) ”这句话。
b.  把构造方法改成(public function __construct($fileField, $config, $type = "upload", $watermark = false)。
c.  在构造方法里面写上 ($this->water = $watermark; )这句话。
d.  在upFile 方法内部后面添加以下代码:
 

 if( $this->water ){ $this->watermark($this->filePath,$this->filePath);}

e. 在这个类文件里添加以下方法,实现图片添加水印

 /** 图片加水印* $source  string  图片资源* $target  string  添加水印后的名字* $w_pos   int     水印位置安排(1-10)【1:左头顶;2:中间头顶;3:右头顶...值空:随机位置】* $w_img   string  水印图片路径* $w_text  string  显示的文字* $w_font  int     字体大小* $w_color string  字体颜色*/public function watermark($source, $target = '', $w_pos = '', $w_img = '', $w_text = '留学问多点',$w_font = 10, $w_color = '#CC0000') {$this->w_img = '../watermark.png';//水印图片$this->w_pos = 9;$this->w_minwidth = 220;//最少宽度$this->w_minheight = 220;//最少高度$this->w_quality = 80;//图像质量$this->w_pct = 50;//透明度$w_pos = $w_pos ? $w_pos : $this->w_pos;$w_img = $w_img ? $w_img : $this->w_img;if(!$this->check($source)) return false;if(!$target) $target = $source;$source_info = getimagesize($source);//图片信息$source_w  = $source_info[0];//图片宽度$source_h  = $source_info[1];//图片高度if($source_w < $this->w_minwidth || $source_h < $this->w_minheight) return false;switch($source_info[2]) { //图片类型case 1 : //GIF格式$source_img = imagecreatefromgif($source);break;case 2 : //JPG格式$source_img = imagecreatefromjpeg($source);break;case 3 : //PNG格式$source_img = imagecreatefrompng($source);//imagealphablending($source_img,false); //关闭混色模式imagesavealpha($source_img,true); //设置标记以在保存 PNG 图像时保存完整的 alpha 通道信息(与单一透明色相反)break;default :return false;}if(!empty($w_img) && file_exists($w_img)) { //水印图片有效$ifwaterimage = 1; //标记$water_info  = getimagesize($w_img);$width    = $water_info[0];$height    = $water_info[1];switch($water_info[2]) {case 1 :$water_img = imagecreatefromgif($w_img);break;case 2 :$water_img = imagecreatefromjpeg($w_img);break;case 3 :$water_img = imagecreatefrompng($w_img);imagealphablending($water_img,false);imagesavealpha($water_img,true);break;default :return;}}else{$ifwaterimage = 0;$temp = imagettfbbox(ceil($w_font*2.5), 0, './MPublic/fonts/heiti.otf', $w_text); //imagettfbbox返回一个含有 8 个单元的数组表示了文本外框的四个角$width = $temp[2] - $temp[6];$height = $temp[3] - $temp[7];unset($temp);}switch($w_pos) {case 1:$wx = 5;$wy = 5;break;case 2:$wx = ($source_w - $width) / 2;$wy = 0;break;case 3:$wx = $source_w - $width;$wy = 0;break;case 4:$wx = 0;$wy = ($source_h - $height) / 2;break;case 5:$wx = ($source_w - $width) / 2;$wy = ($source_h - $height) / 2;break;case 6:$wx = $source_w - $width;$wy = ($source_h - $height) / 2;break;case 7:$wx = 0;$wy = $source_h - $height;break;case 8:$wx = ($source_w - $width) / 2;$wy = $source_h - $height;break;case 9:$wx = $source_w - ($width+5);$wy = $source_h - ($height+5);break;case 10:$wx = rand(0,($source_w - $width));$wy = rand(0,($source_h - $height));break;       default:$wx = rand(0,($source_w - $width));$wy = rand(0,($source_h - $height));break;}/*dst_im  目标图像src_im  被拷贝的源图像dst_x   目标图像开始 x 坐标dst_y   目标图像开始 y 坐标,x,y同为 0 则从左上角开始src_x   拷贝图像开始 x 坐标src_y   拷贝图像开始 y 坐标,x,y同为 0 则从左上角开始拷贝src_w   (从 src_x 开始)拷贝的宽度src_h   (从 src_y 开始)拷贝的高度pct 图像合并程度,取值 0-100 ,当 pct=0 时,实际上什么也没做,反之完全合并。*/if($ifwaterimage) {if($water_info[2] == 3) {imagecopy($source_img, $water_img, $wx + 10, $wy , 0, 0, $width, $height);}else{imagecopymerge($source_img, $water_img, $wx, $wy, 0, 0, $width, $height, $this->w_pct);}}else{if(!empty($w_color) && (strlen($w_color)==7)) {$r = hexdec(substr($w_color,1,2));$g = hexdec(substr($w_color,3,2));$b = hexdec(substr($w_color,5));}else{return;}imagestring($source_img,$w_font,$wx,$wy,$w_text,imagecolorallocate($source_img,$r,$g,$b));}switch($source_info[2]) {case 1 :imagegif($source_img, $target); //GIF 格式将图像输出到浏览器或文件(欲输出的图像资源, 指定输出图像的文件名)break;case 2 :imagejpeg($source_img, $target, $this->w_quality);break;case 3 :imagepng($source_img, $target);break;default :return;}// $font = "./MPublic/fonts/heiti.otf";// $image->open($name)->text("留学问多点",$font,27,'#82797A',array(95,$height))->save($name);if(isset($water_info)){unset($water_info);}if(isset($water_img)) {imagedestroy($water_img);}unset($source_info);imagedestroy($source_img);return true;}public function check($image){return extension_loaded('gd') && preg_match("/\.(jpg|jpeg|gif|png)/i", $image, $m) && file_exists($image) && function_exists('imagecreatefrom'.($m[1] == 'jpg' ? 'jpeg' : $m[1]));}

 到这一步,已经基本完成添加水印的处理了,记得要在根目录下放水印图片watermark.png;

4.第四步要解决的是前台选择“是否添加水印”的交互

a.在/dialogs/image/image.html添加以下代码:

<span class="water"">水印: <input  type="radio" name="iswater" class="iswater iswater_a" value="1" checked>是<input type="radio" name="iswater" class="iswater iswater_b" value="0" >否</span>

b.去image.js找到actionUrl,添加红框内代码,是为1,否为0,这样就可以通过actionUrl传到后台判断是否添加水印了

c.去php/controller.php添加以下红框代码,用于接收数据

d.打开ueditor目录下的php目录下的action_upload.php文件,如图多传判断是否添加水印的参数,即大功告成。

转载于:https://www.cnblogs.com/boats/p/8110135.html

关于ueditor多图上传加水印相关推荐

  1. java ueditor 图片上传加水印_关于ueditor多图上传加水印

    最近小二哥应运营要求,需在后台编辑器做图片添加水印功能,由于ueditor编辑器本身没有添加水印的功能: 所以小二哥参考了网上的一些方法,加上实现的步骤整理成文档,希望对需要的人有帮助. 1.打开ue ...

  2. 图片上传(加水印、缩略图、远程保存)的简单例子

    图片上传(加水印.缩略图.远程保存)的简单例子(应用于51aspx.com) 该源码下载地址:http://51aspx.com/CV/ImageUpload 今天看到xiongeee发的文章使用使用 ...

  3. java ueditor 图片上传加水印_百度ueditor上传图片加水印的例子

    百度ueditor上传图片默认没有水印功能的如果我们要添加水印需要在程序上进行一些添加了,下面来看看百度ueditor上传图片加水印的例子吧. 打开UEditor压缩包下php目录中的上传类文件:Up ...

  4. 通过UEditor多图上传到七牛云出现图片不全,或上传失败bug

    在node-ueditor进行拓展,通过多图上传直接将图片保存到七牛云.在保存的时候通过busboy包进行文件流保存 bug: 发现多张图片上传时候,部分图片出现上传失败,或显示出得图片只有一半的情况 ...

  5. java ueditor 图片上传加水印_Ueditor编辑器上传图片加水印【亲测可用】-帝国CMS整合...

    Ueditor编辑器上传图片加水印 百度一下,有很多,但是方法都是一样的,写的不清不楚的.对于代码不是很了解的我们,却是头大.我整理了一下,下载下面的压缩包,解压缩之后,直接上传到  ueditor ...

  6. java图片加水印上传工具类_基于Spring Boot实现图片上传/加水印一把梭操作

    文章共537字,阅读大约需要 2分钟 ! 概述 很多网站的图片为了版权考虑都加有水印,尤其是那些图片类网站.自己正好最近和图片打交道比较多,因此就探索了一番基于 Spring Boot这把利器来实现从 ...

  7. java spring上传图片_基于Spring Boot实现图片上传/加水印一把梭操作

    文章共 537字,阅读大约需要 2分钟 ! 概述 很多网站的图片为了版权考虑都加有水印,尤其是那些图片类网站.自己正好最近和图片打交道比较多,因此就探索了一番基于 Spring Boot这把利器来实现 ...

  8. php 上传加水印,php 图片上传加水印(自动增加水印)

    function upload($uploadfile,$watermark=1,$watertype=1,$content){ foreach($uploadfile['name'] as $key ...

  9. php 文件预览 水印,PHP图片上传,预览图上传,水印设置

    //设置图片的存放目录 设置水印的存放地址如果愿意,可以给预览图.上传图片分设不同的存储地址 $img_path = $_SERVER['DOCUMENT_ROOT']."/data/img ...

最新文章

  1. 库克的采访给我们带来的思考!
  2. Bug in Code CodeForces - 420C (计数,图论)
  3. 【渝粤教育】国家开放大学2018年秋季 0109-21T公司财务 参考试题
  4. mysql 导入.sql文件_MySQL导入.sql文件及常用命令
  5. java内存stack heap_java内存解析-------stack(栈)和heap(堆)的理解
  6. 聊聊区块链,虽然我不挖矿!
  7. 这是一段有毒的js代码,求大神解释!!!
  8. ubuntu中安装sqldeveloper和JDK 1.7
  9. liunx机器开放8080端口
  10. 我的原创IT著作再次被中科院图书馆、国图等国家级学术机构收藏!
  11. apicloud 打开高德地图进行导航
  12. [Python嗯~机器学习]---用python3来分析和预测加州房价
  13. 公众号头条文章数据接口 API
  14. fastjson 是反射吗_6种超声检测灵敏度,你都知道吗?
  15. STM32外部引脚电路个人总结
  16. pytorch学习笔记(八):PytTorch可视化工具 visdom
  17. 搭建IPv6签到服务器,并使用FRP获取IPv6信息
  18. u盘拷贝服务器文件,服务器向u盘拷贝数据库
  19. 企业网络安全防御策略需要考虑哪些方面?
  20. 领英让出的市场,有谁能补位成功?

热门文章

  1. thinkphp 个别字段无法更新_Ripro子主题:jizhichlid极致主题,原创首发永久更新,不限域名永乐使用...
  2. python批量分析表格_示例python 批量操作excel统计销售榜品牌及销售额
  3. 1、lombok的初始使用
  4. 重装win8系统后变成C盘了别的分区的资料怎样恢复
  5. python java
  6. 十进制度转换为度分秒
  7. 在URL地址栏中显示ico
  8. ABBYY PDF Transformer+支持的格式
  9. who,cut,diff,which,whereis,locate,updatedb 命令的使用
  10. bat批处理重命名问题