问题的正确处理,php下图片文字混合水印与缩略
分类:新闻中心

前言

前言

最近做移动web项目但是遇到在苹果设备上html上传图片后,图片传到后台是旋转的 旋转角度不一,因此再次

一 imageCreateFrom* 图片载入函数
//针对不同的后缀名图片
imagecreatefromgif
imagecreatefromjpeg
imagecreatefrompng
imagecreatefromwbmp
imagecreatefromstring
使用格式:imagecreatefromgif("jjj.gif");
二 imagecopy 图片合并函数
imagecopy(destimage,simage,int x,int y,int src_x,int src_y,int src_w,int src_h);
destimage ---原始图片(大图片)
simage ---logo图片(小图片)
x ---原始图片的坐标
y ---
src_x ---logo图片的坐标
src_y ---
src_w ---logo图片的宽度
src_h ---logo图片的高度

iPhone和一些数码相机在拍照的时候往往会在图片里面加入很多的照片信息(exif),比如拍照时间、光圈大小、曝光时间、GSP地理信息以及拍摄时相机倾斜状态等等,这些信息往往会提供给某些系统来对图片进行正确的显示,但是我们在对处理图片的时候通常会丢失掉那些图片信息,这就会导致显示出现问题,很典型的一个显示错误就是对Iphone拍摄的照片进行剪裁之后发现图片旋转了90度,这个时候就需要对图片进行相应的处理。

iPhone和一些数码相机在拍照的时候往往会在图片里面加入很多的照片信息(exif),比如拍照时间、光圈大小、曝光时间、GSP地理信息以及拍摄时相机倾斜状态等等,这些信息往往会提供给某些系统来对图片进行正确的显示,但是我们在对处理图片的时候通常会丢失掉那些图片信息,这就会导致显示出现问题,很典型的一个显示错误就是对Iphone拍摄的照片进行剪裁之后发现图片旋转了90度,这个时候就需要对图片进行相应的处理。

读取照片时,无法正常显示,目前已经找到解决方法,至于原因看不太懂 翻译过来也是完全按照单词翻译词语不同。

三 imagecopyresized图片剪切函数
imagecopyresized(resource dst_image,resource src_image,int dst_x,int dst_y,int src_x,int src_y,int dst_w,int dst_h,int src_w,int src_h);
dst_image ---原始真彩图片
src_image ---原始图片
dst_x ---从什么位置起 一般为0
dst_y ---一般为0
src_x ---从什么地方开始剪切 一般为0
src_y ---一般为0
dst_w ---新建图片的宽度与高度
dst_h ---
src_w ---原始图片的宽度与高度
src_h ---

背景

背景

但是把方法共享出来。貌似原因是苹果偷了一个懒没有对拍摄后的照片进行处理,而安卓则处理了。

例题:
image.php

博主是在一个小项目中遇到的这个问题,这个项目虽然小,但是涉及到的各种坑真的可以写一篇比较长的技术文章了,这里先不描述,后面单独发一篇关于这个项目的文章,把所涉及到的知识点以及坑点一一描述。

博主是在一个小项目中遇到的这个问题,这个项目虽然小,但是涉及到的各种坑真的可以写一篇比较长的技术文章了,这里先不描述,后面单独发一篇关于这个项目的文章,把所涉及到的知识点以及坑点一一描述。

旋转原因受到苹果设备拍摄角度影响,下面是解决方法。php上环境 其他的语言做相应调整即可。原理相同

复制代码 代码如下:

这个小项目中遇到的问题之一就是,我需要使用html5的canvas把读取到的图片进行剪裁,然后渲染到画布上。很简单的一个需求,但是在Iphone上测试经常会看到剪裁完之后图片自动旋转了90度,安卓机上不存在这个问题。

这个小项目中遇到的问题之一就是,我需要使用html5的canvas把读取到的图片进行剪裁,然后渲染到画布上。很简单的一个需求,但是在Iphone上测试经常会看到剪裁完之后图片自动旋转了90度,安卓机上不存在这个问题。

 前置准备 需要在php.ini文件中启用extension=php_exif.dll  才会有exif_read_data方法

<?php
/*
* 这个php文件实现图片的水印与生成缩略图功能
*
*/
//这个没写上传功能,首先把图片放到项目的根目录
//导入与解析图片
$image = "img.jpg";
$img=GetImageSize($image);
//判断图片的后缀名
switch($img[2]){
case 1:
$im=ImageCreateFromGIF($image);
break;
case 2:
$im=ImageCreateFromJPEG($image);
break;
case 3:
$im=ImageCreateFromPNG($image);
break;
}
//解析图片
$logo = "pic.jpg";
$pic=GetImageSize($logo);
switch($pic[2]){
case 1:
$im_pic=ImageCreateFromGIF($logo);
break;
case 2:
$im_pic=ImageCreateFromJPEG($logo);
break;
case 3:
$im_pic=ImageCreateFromPNG($logo);
break;
}
//图片合成,也是制作水印
imagecopy($im,$im_pic,0,500,0,0,100,75);
//设置颜色
$fc=imagecolorallocate($im,255,255,255);
//首先要将文字转换成utf-8格式
//$str=iconv("gb2312","utf-8","呵呵呵");
//加入中文水印
imagettftext($im,12,0,20,20,$fc,"simkai.ttf","我的QQ:260954520");
//建一个原始真彩图片
$new_img=imagecreatetruecolor(50,40);
//剪切图片
imagecopyresized($new_img,$im,0,0,0,0,50,40,$img[0],$img[1]);
//输出图片
header("Content-type:image/jpeg");
//剪切后的小图,可以像下面一个用判断生成小图
imagejpeg($new_img);
//生成一个加水印的图片
/*
if(imagejpeg($im,"新的图片.jpg")){
echo "水印成功";
}
*/
?>

分析

分析

您可能感兴趣的文章:

  • php文字水印和php图片水印实现代码(二种加水印方法)
  • php给图片添加文字水印方法汇总
  • php图片加水印原理(超简单的实例代码)
  • 超级好用的一个php上传图片类(随机名,缩略图,加水印)
  • php gd2 上传图片/文字水印/图片水印/等比例缩略图/实现代码
  • php图片处理:加水印、缩略图的实现(自定义函数:watermark、thumbnail)
  • PHP Imagick完美实现图片裁切、生成缩略图、添加水印
  • 功能强大的PHP图片处理类(水印、透明度、旋转)
  • PHP上传图片进行等比缩放可增加水印功能
  • PHP经典的给图片加水印程序
  • PHP实现可添加水印与生成缩略图的图片处理工具类

之前就遇到过这个问题,iPhone拍摄的照片复制到win7上打开图片就是一个倒过来的,而在手机上看却没有问题,这就是因为exif信息在搞鬼,简单点说exif就是保留了图片的拍摄参数,显示的时候程序会读取图片的exif信息,如果exif信息不存在,那么图片就是按照最原始的形式显示,如果有exif信息,程序就会按照exif来。

之前就遇到过这个问题,iPhone拍摄的照片复制到win7上打开图片就是一个倒过来的,而在手机上看却没有问题,这就是因为exif信息在搞鬼,简单点说exif就是保留了图片的拍摄参数,显示的时候程序会读取图片的exif信息,如果exif信息不存在,那么图片就是按照最原始的形式显示,如果有exif信息,程序就会按照exif来。

<?php
$image = imagecreatefromstring(file_get_contents($_FILES['image_upload']['tmp_name']));
$exif = exif_read_data($_FILES['image_upload']['tmp_name']);
if(!empty($exif['Orientation'])) {
    switch($exif['Orientation']) {
        case 8:
            $image = imagerotate($image,90,0);
            break;
        case 3:
            $image = imagerotate($image,180,0);
            break;
        case 6:
            $image = imagerotate($image,-90,0);
            break;
    }
}
// $image now contains a resource with the image oriented correctly
?>

这里博主遇到的情况是图片在进行剪裁的时候导致exif信息丢失,本来程序读取exif中图片要求顺时针旋转90°,现在exif丢失,程序读不到,默认图片不用旋转,那么我们看到的图片就是倒着的,这里应该怎么解决呢?

这里博主遇到的情况是图片在进行剪裁的时候导致exif信息丢失,本来程序读取exif中图片要求顺时针旋转90°,现在exif丢失,程序读不到,默认图片不用旋转,那么我们看到的图片就是倒着的,这里应该怎么解决呢?

在这个项目中,由于读取的图片存在跨域问题,不能直接对本地的图片进行裁剪,所以是先上传到远程服务器,生成一个远程的地址,然后再用canvas读取远程地址,这样就解决了跨域问题。

在这个项目中,由于读取的图片存在跨域问题,不能直接对本地的图片进行裁剪,所以是先上传到远程服务器,生成一个远程的地址,然后再用canvas读取远程地址,这样就解决了跨域问题。

现在摆在博主面前就有两种解决方案了

现在摆在博主面前就有两种解决方案了

只用exif.js本地读取图片的exif信息,直接在客户端进行判断

  1. 只用exif.js本地读取图片的exif信息,直接在客户端进行判断
  2. 上传到服务器的时候对图片进行处理,返回的远程地址已经是处理过的图片

上传到服务器的时候对图片进行处理,返回的远程地址已经是处理过的图片

对这两种方案进行对比,第一种方案看起来确实挺适合,直接在前端进行处理,这里会非常节省服务器资源,但是缺点也很明显,canvas对图片的渲染有一定的限制,当图片过大的时候渲染就会失败,而在这个项目中客户要求最后生成的图片一定要高清大图,上传的照片一般都有3~5M大小,这么大的图片大多数时候canvas都无法处理。

对这两种方案进行对比,第一种方案看起来确实挺适合,直接在前端进行处理,这里会非常节省服务器资源,但是缺点也很明显,canvas对图片的渲染有一定的限制,当图片过大的时候渲染就会失败,而在这个项目中客户要求最后生成的图片一定要高清大图,上传的照片一般都有3~5M大小,这么大的图片大多数时候canvas都无法处理。

exif.js的原理其实比较简单,就是把图片转换成base64字符串,对其中的信息进行解析,所以一旦要对大图进行处理的时候就会出现问题,数据量太大,导致失败。

exif.js的原理其实比较简单,就是把图片转换成base64字符串,对其中的信息进行解析,所以一旦要对大图进行处理的时候就会出现问题,数据量太大,导致失败。

第一种方案不可行就只能选择第二种方案了,项目后端使用php做中转处理,前面说了需要生成一个远程地址,php负责把接收到的图片存储在远程服务器,然后返回一个地址给前端,这里只需要在存储之前对图片做处理就可以解决这个问题。

第一种方案不可行就只能选择第二种方案了,项目后端使用php做中转处理,前面说了需要生成一个远程地址,php负责把接收到的图片存储在远程服务器,然后返回一个地址给前端,这里只需要在存储之前对图片做处理就可以解决这个问题。

解决

解决

首先给出完整代码,然后对代码进行解释

首先给出完整代码,然后对代码进行解释

include_once ("../weixin/jssdk.php");
$jssdk = new JSSDK("wx**************", "******************************");
$access_token = $jssdk->getAccessToken();

$media_id = $_POST['i'];
$savePathFile = '/upload/temps/'.date('YmdHis').rand(1000,9999).'.jpg';
$targetName = __DIR__.$savePathFile;

$str = "http://file.api.weixin.qq.com/cgi-bin/media/get?access_token=".$access_token."&media_id=".$media_id;
$image = imagecreatefromstring(file_get_contents($str));
$exif = exif_read_data($str);

if(!empty($exif['Orientation'])) {
 switch($exif['Orientation']) {
 case 8:
  $image = imagerotate($image,90,0);
  break;
 case 3:
  $image = imagerotate($image,180,0);
  break;
 case 6:
  $image = imagerotate($image,-90,0);
  break;
 }
}

imagejpeg($image,$targetName);
echo json_encode(array("code"=>0,'d'=>$exif['Orientation'],"path"=>$savePathFile));

include_once ("../weixin/jssdk.php");
$jssdk = new JSSDK("wx**************", "******************************");
$access_token = $jssdk->getAccessToken();

看起来确实比较简单,主要还是调用了一些内部函数,处理起来就方便多了。

$media_id = $_POST['i'];
$savePathFile = '/upload/temps/'.date('YmdHis').rand(1000,9999).'.jpg';
$targetName = __DIR__.$savePathFile;

这个项目使用了微信的上传接口,所以php需要从微信的临时服务器上把用户上传的图片取回来,通过file_get_contents方法就能快速拿到,当然也可以用curl来做。接着使用imagecreatefromstring创建一个图片的缓存,正常情况下如果不需要对图片进行处理,那么接下来就可以直接存储了,这里我们还需要对图片进行一些操作。

$str = ";
$image = imagecreatefromstring(file_get_contents($str));
$exif = exif_read_data($str);

通过 exif_read_data 方法可以直接读取到图片的exif信息。

if(!empty($exif['Orientation'])) {
    switch($exif['Orientation']) {
        case 8:
            $image = imagerotate($image,90,0);
            break;
        case 3:
            $image = imagerotate($image,180,0);
            break;
        case 6:
            $image = imagerotate($image,-90,0);
            break;
    }
}

注意:exif_read_data 这个方法是exif扩展里面的方法,如果不能执行,请检查扩展是否安装,是否开启等。

imagejpeg($image,$targetName);
echo json_encode(array("code"=>0,'d'=>$exif['Orientation'],"path"=>$savePathFile));
看起来确实比较简单,主要还是调用了一些内部函数,处理起来就方便多了。

exif模块里面还有很多有意思的方法,可以拿来做很多有用的东西,比如拿来批量采集并分析图片,提取图片信息等。

这个项目使用了微信的上传接口,所以php需要从微信的临时服务器上把用户上传的图片取回来,通过file_get_contents方法就能快速拿到,当然也可以用curl来做。接着使用imagecreatefromstring创建一个图片的缓存,正常情况下如果不需要对图片进行处理,那么接下来就可以直接存储了,这里我们还需要对图片进行一些操作。

if(!empty($exif['Orientation'])) {
 switch($exif['Orientation']) {
 case 8:
  $image = imagerotate($image,90,0);
  break;
 case 3:
  $image = imagerotate($image,180,0);
  break;
 case 6:
  $image = imagerotate($image,-90,0);
  break;
 }
}

通过 exif_read_data 方法可以直接读取到图片的exif信息。

这一段就很容易看懂了,就是判断图片的旋转状态,对图片进行旋转处理imagerotate方法很好用,当然同类的还有好多函数,可以去了解下,如果你正在做图片处理,这些函数应该会有很大的帮助。

注意:exif_read_data 这个方法是exif扩展里面的方法,如果不能执行,请检查扩展是否安装,是否开启等。

最后使用 imagejpeg 方法把处理过的图片写入到磁盘,然后返回一个包含远程地址的json到前端。

exif模块里面还有很多有意思的方法,可以拿来做很多有用的东西,比如拿来批量采集并分析图片,提取图片信息等,这里推荐一个好玩的网站

注意:我这里没有做异常捕获,正常情况下文件io操作都必须要做异常捕获,这里的代码只为了说明使用方法,所以省略了这一步。

if(!empty($exif['Orientation'])) {
    switch($exif['Orientation']) {
        case 8:
            $image = imagerotate($image,90,0);
            break;
        case 3:
            $image = imagerotate($image,180,0);
            break;
        case 6:
            $image = imagerotate($image,-90,0);
            break;
    }
}
这一段就很容易看懂了,就是判断图片的旋转状态,对图片进行旋转处理imagerotate方法很好用,当然同类的还有好多函数,可以去了解下,如果你正在做图片处理,这些函数应该会有很大的帮助。

总结

最后使用 imagejpeg 方法把处理过的图片写入到磁盘,然后返回一个包含远程地址的json到前端。

在这个小项目中,最为常见的问题就是在php函数的使用上,同一种效果可以使用多个函数进行处理,选择一个简洁高效的函数非常重要,在使用第三方扩展的时候务必确认扩展是否安装,扩展依赖的插件是否安装,是否已经开启,是否有其他额外的附加条件等。

注意:我这里没有做异常捕获,正常情况下文件io操作都必须要做异常捕获,这里的代码只为了说明使用方法,所以省略了这一步。

前端方面需要知道所使用的js插件有那些附加功能,如果api文章不够清晰可以直接打开插件源码,通常情况下,一个出色的插件往往会在未压缩的代码里面写明所有接口的使用方法,以及注意事项,使用条件等。

后记

此外,还需要对不常见的情况进行判定,当出现一些诡异bug的时候就应该考虑是否是因为当前所给的参数不符合规范,或者超出了规范允许的范围,上面说道的图片转base64格式的大小限制就是一个很难被发现的问题,博主在调试的时候对生成的数据进行观察才发现,当出现大图的时候就会转换失败。

在这个小项目中,最为常见的问题就是在php函数的使用上,同一种效果可以使用多个函数进行处理,选择一个简洁高效的函数非常重要,在使用第三方扩展的时候务必确认扩展是否安装,扩展依赖的插件是否安装,是否已经开启,是否有其他额外的附加条件等。

好了,以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

前端方面需要知道所使用的js插件有那些附加功能,如果api文章不够清晰可以直接打开插件源码,通常情况下,一个出色的插件往往会在未压缩的代码里面写明所有接口的使用方法,以及注意事项,使用条件等。

您可能感兴趣的文章:

  • PHP 中 Orientation 属性判断上传图片是否需要旋转
  • PHP图片处理之图片旋转和图片翻转实例
  • php旋转图片90度的方法
  • PHP实现图片旋转效果实例代码

此外,还需要对不常见的情况进行判定,当出现一些诡异bug的时候就应该考虑是否是因为当前所给的参数不符合规范,或者超出了规范允许的范围,上面说道的图片转base64格式的大小限制就是一个很难被发现的问题,博主在调试的时候对生成的数据进行观察才发现,当出现大图的时候就会转换失败。

本文由美高梅网址发布于新闻中心,转载请注明出处:问题的正确处理,php下图片文字混合水印与缩略

上一篇:没有了 下一篇:没有了
猜你喜欢
热门排行
精彩图文