当前位置:首页 > 代码类 > 百度ueditor上传图片加水印的例子

百度ueditor上传图片加水印的例子

九天狼8年前 (2016-10-01)代码类3107

百度ueditor上传图片默认没有水印功能的如果我们要添加水印需要在程序上进行一些添加了,下面来看看百度ueditor上传图片加水印的例子吧。

打开UEditor压缩包下php目录中的上传类文件:Uploader.class.php

在上传文件的主要方法下添加调用水印处理方法:

 代码如下

/**
   * 上传文件的主处理方法
   * @return mixed
  */
private function upFile()
{
……………………
……………………
$this->stateInfo = $this->stateMap[0]; //(大概在122行)
//在下面加入如下调用水印的处理方法:
$this->imageWaterMark($this->filePath,9,'../img/watermark.png'); //注释见本文下面imageWaterMark()函数方法
……………………
}


水印处理方法/函数:

 代码如下

/**
   * 功能:PHP图片水印 (水印支持图片或文字)
   * 参数:
   * $groundImage 背景图片,即需要加水印的图片,暂只支持GIF,JPG,PNG格式;
   * $waterPos水印位置,有10种状态,0为随机位置;
   * 1为顶端居左,2为顶端居中,3为顶端居右;
   * 4为中部居左,5为中部居中,6为中部居右;
   * 7为底端居左,8为底端居中,9为底端居右;
   * $waterImage图片水印,即作为水印的图片,暂只支持GIF,JPG,PNG格式;
   * $waterText文字水印,即把文字作为为水印,支持ASCII码,不支持中文;
   * $textFont文字大小,值为1、2、3、4或5,默认为5;
   * $textColor文字颜色,值为十六进制颜色值,默认为#FF0000(红色);
   *
   * 注意:Support GD 2.0,Support FreeType、GIF Read、GIF Create、JPG 、PNG
   * $waterImage 和 $waterText 最好不要同时使用,选其中之一即可,优先使用 $waterImage。
   * 当$waterImage有效时,参数$waterString、$stringFont、$stringColor均不生效。
   * 加水印后的图片的文件名和 $groundImage 一样。
     */
  private function imageWaterMark($groundImage,$waterPos=0,$waterImage="",$waterText="",$textFont=5,$textColor="#FF0000")
  {
    $isWaterImage = FALSE;
    $formatMsg = "暂不支持该文件格式,请用图片处理软件将图片转换为GIF、JPG、PNG格式。";
    
    //读取水印文件
    if(!empty($waterImage) && file_exists($waterImage))
    {
      $isWaterImage = TRUE;
      $water_info = getimagesize($waterImage);
      $water_w = $water_info[0];//取得水印图片的宽
      $water_h = $water_info[1];//取得水印图片的高 
      switch($water_info[2])//取得水印图片的格式
      {
        case 1:$water_im = imagecreatefromgif($waterImage);break;
        case 2:$water_im = imagecreatefromjpeg($waterImage);break;
        case 3:$water_im = imagecreatefrompng($waterImage);break;
        default:die($formatMsg);
      }
    }
    //读取背景图片
    if(!empty($groundImage) && file_exists($groundImage))
    {
      $ground_info = getimagesize($groundImage);
      $ground_w = $ground_info[0];//取得背景图片的宽
      $ground_h = $ground_info[1];//取得背景图片的高
      switch($ground_info[2])//取得背景图片的格式
      {
        case 1:$ground_im = imagecreatefromgif($groundImage);break;
        case 2:$ground_im = imagecreatefromjpeg($groundImage);break;
        case 3:$ground_im = imagecreatefrompng($groundImage);break;
        default:die($formatMsg);
      }
    }
    else
    {
      die("需要加水印的图片不存在!");
    }
    //水印位置
    if($isWaterImage)//图片水印
    {
      $w = $water_w;
      $h = $water_h;
      $label = "图片的";
    }
    else//文字水印
    {
      $temp = imagettfbbox(ceil($textFont*5),0,"./cour.ttf",$waterText);//取得使用 TrueType 字体的文本的范围
      $w = $temp[2] - $temp[6];
      $h = $temp[3] - $temp[7];
      unset($temp);
      $label = "文字区域";
    }
    if( ($ground_w<$w) || ($ground_h<$h) )
    {
      echo "需要加水印的图片的长度或宽度比水印".$label."还小,无法生成水印!";
      return;
    }
    
    switch($waterPos)
    {
      case 0://随机
        $posX = rand(0,($ground_w - $w));
        $posY = rand(0,($ground_h - $h));
        break;
      case 1://1为顶端居左
        $posX = 0;
        $posY = 0;
        break;
      case 2://2为顶端居中
        $posX = ($ground_w - $w) / 2;
        $posY = 0;
        break;
      case 3://3为顶端居右
        $posX = $ground_w - $w;
        $posY = 0;
        break;
      case 4://4为中部居左
        $posX = 0;
        $posY = ($ground_h - $h) / 2;
        break;
      case 5://5为中部居中
        $posX = ($ground_w - $w) / 2;
        $posY = ($ground_h - $h) / 2;
        break;
      case 6://6为中部居右
        $posX = $ground_w - $w;
        $posY = ($ground_h - $h) / 2;
        break;
      case 7://7为底端居左
        $posX = 0;
        $posY = $ground_h - $h;
        break;
      case 8://8为底端居中
        $posX = ($ground_w - $w) / 2;
        $posY = $ground_h - $h;
        break;
      case 9://9为底端居右
        $posX = $ground_w - $w - 10;   // -10 是距离右侧10px 可以自己调节
        $posY = $ground_h - $h - 10;   // -10 是距离底部10px 可以自己调节
        break;
      default://随机
        $posX = rand(0,($ground_w - $w));
        $posY = rand(0,($ground_h - $h));
        break;
    }
    //设定图像的混色模式
    imagealphablending($ground_im, true);
    if($isWaterImage)//图片水印
    {
      imagecopy($ground_im, $water_im, $posX, $posY, 0, 0, $water_w,$water_h);//拷贝水印到目标文件 
    }
    else//文字水印
    {
      if( !emptyempty($textColor) && (strlen($textColor)==7) )
      {
        $R = hexdec(substr($textColor,1,2));
        $G = hexdec(substr($textColor,3,2));
        $B = hexdec(substr($textColor,5));
      }
      else
      {
        die("水印文字颜色格式不正确!");
      }
      imagestring ( $ground_im, $textFont, $posX, $posY, $waterText, imagecolorallocate($ground_im, $R, $G, $B)); 
    }
    //生成水印后的图片
    @unlink($groundImage);
    
    switch($ground_info[2])//取得背景图片的格式
    {
      case 1:imagegif($ground_im,$groundImage);break;
      case 2:imagejpeg($ground_im,$groundImage);break;
      case 3:imagepng($ground_im,$groundImage);break;
      default:die($errorMsg);
    }
    //释放内存
    if(isset($water_info)) unset($water_info);
    if(isset($water_im)) imagedestroy($water_im);
    unset($ground_info);
    imagedestroy($ground_im);
  }


基于上述方法,你也可以在多图上传中添加相关选项让用户自定义选择水印添加的位置。

A simple example:

(1)使用UEditor编辑器的serverparam参数,参数作用:自定义请求参数

视图中添加允许用户自主选择是否添加水印的checkbox,代码:

<input type="checkbox" name="wmid" id="wmid_fmdata[content]" checked="checked" onclick_fckprotectedatt=" onclick="cancelwm(this);"" /><label for="wmid_fmdata[content]">水印</label> <span style="color:red;">(提示:每次上传前可选择是否使用水印)</span></span>

视图中添加如下代码追加向后台发出请求时添加wm参数:

 代码如下


ue.ready(function() { //页面初始化完成默认为加水印状态
  UE.getEditor('editor').execCommand('serverparam', 'wm', 1);
});
function cancelwm(t){
  if(t.checked){
    UE.getEditor('editor').execCommand('serverparam', 'wm', 1);
  }else{
    UE.getEditor('editor').execCommand('serverparam', 'wm', 0);
  }  
}


(2)action_upload.php附件上传控制代码文件中获取wm参数并初始化上传类:

 代码如下

/*
* 判断是否添加水印
*/
$wm = $_GET['wm'];
$up = new Uploader($fieldName, $config, $base64,$wm);


(3)Uploader.class.php类文件中处理是否添加水印,过程代码略。


如果内容对你有用,请花费几秒钟给个评论!

由于评论审核机制,可能您的评论暂时不可见,不影响查看回复可见的内容!

扫描二维码推送至手机访问。

版权声明:本文由云淡风轻Mr.Liu发布,如需转载请注明出处。

本文链接:https://nylmj.cn/post/18.html

相关文章

 ueditor 上传的图片在内容里显示的尺寸过大的问题

ueditor 上传的图片在内容里显示的尺寸过大的问题

网上有方法1.ueditor 的 themes 文件夹下有个iframe.css 加入以下代码,保存(原先的css文件应该是空的,只有一行注释)/// 个人感觉没用,调试了一下确实没用不知为什么,放在...

代码折腾了一下等

代码折腾了一下等

下午,先修改了一个zb的插件,大概用了1个小时,然后发现大谋出了个新的UEDITOR,然后去下载下来,试用,没想到至少用到我这上面有问题...一直弄到现在,也没用成。不弄了,浪费了好几个小时,还是看小...

重新定义.htaccess把多个域名区分开

重新定义.htaccess把多个域名区分开

昨天 晚上,因为要弄一个域名指向一个特定的网页,因此研究了一下.htaccess这个文件,研究后发现,只能指向一个目录的空间基本可以通过.htaccess来绑定不同的域名分别指向不同的目录,因此把服务...

非常好用的Violentmonkey(暴力猴)脚本

非常好用的Violentmonkey(暴力猴)脚本

自从用了Violentmonkey,也就是暴力猴以后,发现这个插件是非常好用,下载、自动加载、广告过滤、解除限制,看小说,方便极了。好了不多说了,先上我所用的脚本大家看看,如果需要,下面就有我打包的脚...

Mactype助手浏览器文字增强插件

Mactype助手浏览器文字增强插件

类型:油猴(暴力猴)脚本  Windows下的浏览器浏览网页时文字往往发虚,颜色很淡,看不清楚。有了它可以让浏览器中...

手机视频VIP会员视频自动解析

手机视频VIP会员视频自动解析

最近在电脑上用油猴插件看视频三无非常爽,无广告无VIP无付费,插件自动解析了,然后就想手机应该也能做到,找了好几天,找了好几个软件,试用后,最终X浏览器比较好用,兼容大总分油猴插件了,而且还能投屏到电...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。