首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 PHP

php处理多图上传压缩代码功能

Posted in PHP onJune 13, 2018

网上看了一些资料，关于处理图片压缩的，找到的大部分是单图压缩的，要么是单前端或者后端的，所以就自己整了下前后端压缩，并支持多图的压缩图片实例。代码有点多，直接复制到编辑器看会比较清楚

1、先创建的一个简单的上传页面upload.php。先通过前端代码压缩图片，直接上代码

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
  <title>实名验证</title>
  <script type="text/javascript">
    /*
    三个参数
    file：一个是文件(类型是图片格式)，
    w：一个是文件压缩的后宽度，宽度越小，字节越小
    objDiv：一个是容器或者回调函数
    photoCompress()
     */
    function photoCompress(file,w,objDiv){
      var ready=new FileReader();
      /*开始读取指定的Blob对象或File对象中的内容. 当读取操作完成时,readyState属性的值会成为DONE,如果设置了onloadend事件处理程序,则调用之.同时,result属性中将包含一个data: URL格式的字符串以表示所读取文件的内容.*/
      ready.readAsDataURL(file);
      ready.onload=function(){
        var re=this.result;
        canvasDataURL(re,w,objDiv)
      }
    }
    function canvasDataURL(path, obj, callback){
      var img = new Image();
      img.src = path;
      img.onload = function(){
        var that = this;
        // 默认按比例压缩
        var w = that.width,
          h = that.height,
          scale = w / h;
        w = obj.width || w;
        h = obj.height || (w / scale);
        var quality = 0.7; // 默认图片质量为0.7
        //生成canvas
        var canvas = document.createElement('canvas');
        var ctx = canvas.getContext('2d');
        // 创建属性节点
        var anw = document.createAttribute("width");
        anw.nodeValue = w;
        var anh = document.createAttribute("height");
        anh.nodeValue = h;
        canvas.setAttributeNode(anw);
        canvas.setAttributeNode(anh);
        ctx.drawImage(that, 0, 0, w, h);
        // 图像质量
        if(obj.quality && obj.quality <= 1 && obj.quality > 0){
          quality = obj.quality;
        }
        // quality值越小，所绘制出的图像越模糊
        var base64 = canvas.toDataURL('image/jpeg', quality);
        // 回调函数返回base64的值
        callback(base64);
      }
    }
    /**
     * 将以base64的图片url数据转换为Blob
     * @param urlData
     * 用url方式表示的base64图片数据
     */
    function convertBase64UrlToBlob(urlData){
      var arr = urlData.split(','), mime = arr[0].match(/:(.*?);/)[1],
        bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
      while(n--){
        u8arr[n] = bstr.charCodeAt(n);
      }
      return new Blob([u8arr], {type:mime});
    }
    var xhr;
    //上传文件方法
    function uploadClick() {
      document.getElementsByClassName("uploadbtn")[0].value = '上传中...';
      document.getElementsByClassName("uploadbtn")[0].disabled=true; 
      var obj = document.getElementsByClassName("myfile");
      for(var i=0;i<2;i++){
        UploadFile(obj[i].files[0],'file'+i);
      }
    }
    function UploadFile(fileObj,filed){
      var shopid = document.getElementById('shopid').value;
      var adminid = document.getElementById('adminid').value;
      var url = "newshimingupload.php"; // 接收上传文件的后台地址 
      var form = new FormData(); // FormData 对象
      if(fileObj.size/1024 > 100) { //大于100k，进行压缩上传
        photoCompress(fileObj, {
          quality: 0.2
        }, function(base64Codes){
          //console.log("压缩后：" + base.length / 1024 + " " + base);
          var bl = convertBase64UrlToBlob(base64Codes);
          form.append("file", bl, "file_"+Date.parse(new Date())+".jpg"); // 文件对象
          form.append("shopid", shopid); // 文件对象
          form.append("adminid", adminid); // 文件对象
          form.append("filed", filed); // 文件对象
          xhr = new XMLHttpRequest(); // XMLHttpRequest 对象
          xhr.open("post", url, false); //post方式，url为服务器请求地址，true 该参数规定请求是否异步处理。
          xhr.onload = uploadComplete; //请求完成
          xhr.onerror = uploadFailed; //请求失败
          // xhr.upload.onprogress = progressFunction;//【上传进度调用方法实现】
          xhr.upload.onloadstart = function(){//上传开始执行方法
            ot = new Date().getTime();  //设置上传开始时间
            oloaded = 0;//设置上传开始时，以上传的文件大小为0
          };
          xhr.send(form); //开始上传，发送form数据
        });
      }else{ //小于等于1M 原图上传
        form.append("file", fileObj); // 文件对象
        form.append("shopid", shopid); // 文件对象
        form.append("adminid", adminid); // 文件对象
        form.append("filed", filed); // 文件对象
        xhr = new XMLHttpRequest(); // XMLHttpRequest 对象
        xhr.open("post", url, false); //post方式，url为服务器请求地址，true 该参数规定请求是否异步处理。
        xhr.onload = uploadComplete; //请求完成
        xhr.onerror = uploadFailed; //请求失败
        xhr.upload.onloadstart = function(){//上传开始执行方法
          ot = new Date().getTime();  //设置上传开始时间
          oloaded = 0;//设置上传开始时，以上传的文件大小为0
        };
        xhr.send(form); //开始上传，发送form数据
      }
    }
    //上传成功响应
    function uploadComplete(evt) {
      //服务断接收完文件返回的结果
      var data = JSON.parse(evt.target.responseText);
      console.log(data);
      if(data.status){
        alert(data.msg);
        if(data.msg == '门店照上传成功'){
          window.location.href = "/dd_admin/index.php";
        }
      }
    }
    //上传失败
    function uploadFailed(evt) {
      alert("网络不稳定，请重新上传！");
    }
  </script>
</head>
<body>
  <style type="text/css">
    .main{text-align: center;padding-top: 50px;}
    .main .myfile{margin-bottom: 15px;}
  </style>
<div class="main">
  营业执照：
  <input type="file" class="myfile" id="file1" name="file1" accept="image/x-png, image/jpg, image/jpeg, image/gif"/><br>
  门店照：
  <input type="file" class="myfile" id="file2" name="file2" accept="image/x-png, image/jpg, image/jpeg, image/gif"/><br>
  <input type="hidden" id="shopid" name="shopid" value="<?php echo $_GET['shopid']; ?>" maxlength="15">
  <input type="hidden" id="adminid" name="adminid" value="<?php echo $_GET['adminid']; ?>" maxlength="15">
  <input style="margin-top: 25px;" class="uploadbtn" type="button" onclick="uploadClick()" value="上传" /><br>
</div>
</body>
</html>
2、前端图片压缩后，请求到自定义的接口upload_deal.php.代码如下
<?php
require_once('public_func.php');
  actionUpload('uploads/','file'); //参数分别代表图片存储的路径和上传的文件名
}
3、在第二部引入public_func.php,这块代码主要是对后端处理图片压缩
function actionUpload($path = '/uploads/',$filename='myFile')
  {
    // $path = 'uploads/';  //图片存放根目录 根据自己项目路径而定
    $file = $_FILES[$filename]['name'];
    $folder = $path.date('Ymd')."/";
    $pre = rand(999,9999).time();
    $ext = strrchr($file,'.');
    $newName = $pre.$ext;
    $out = array(
      'msg'=>'',
      'status'=>'error',
      'img_url'=>''
    );
    if(!is_dir($folder))
    {
      if(!mkdir($folder, 0777, true)){
        $out['msg'] = '图片目录创建失败！';
        echo json_encode($out);
        exit;
      }
    }
    $im = $_FILES[$filename]['tmp_name']; //上传图片资源
    $maxwidth="1056"; //设置图片的最大宽度
    $maxheight="500"; //设置图片的最大高度
    $imgname = $folder.$newName; //图片存放路径 根据自己图片路径而定
    $filetype=$_FILES[$filename]['type'];//图片类型
    $result = thumbImage($im,$maxwidth,$maxheight,$imgname,$filetype);
    if($result){
      $out['msg'] = '图片上传成功';
      $out['status'] = 'success';
      $out['img_url'] = $folder.$newName;
    }else{
      $out['msg'] = '图片上传失败';
    }
    return json_encode($out);
    exit;
  }
  //压缩图片
  function thumbImage($im,$maxwidth,$maxheight,$name,$filetype)
  {
    switch ($filetype) {   
      case 'image/pjpeg':   
      case 'image/jpeg':   
        $im = imagecreatefromjpeg($im);  //PHP图片处理系统函数
        break;   
      case 'image/gif':   
        $im = imagecreatefromgif($im);  
        break;   
      case 'image/png':   
        $im = imagecreatefrompng($im);  
        break;
      case 'image/wbmp':   
        $im = imagecreatefromwbmp($im);  
        break;       
    } 
    $resizewidth_tag = $resizeheight_tag = false;
    $pic_width = imagesx($im);
    $pic_height = imagesy($im);
    if(($maxwidth && $pic_width > $maxwidth) || ($maxheight && $pic_height > $maxheight))
    {
  $resizewidth_tag = $resizeheight_tag = false;
      if($maxwidth && $pic_width>$maxwidth)
      {
        $widthratio = $maxwidth / $pic_width;
        $resizewidth_tag = true;
      }
      if($maxheight && $pic_height>$maxheight)
      {
        $heightratio = $maxheight / $pic_height;
        $resizeheight_tag = true;
      }
      if($resizewidth_tag && $resizeheight_tag)
      {
        if($widthratio < $heightratio)
         $ratio = $widthratio;
        else
         $ratio = $heightratio;
      }
      if($resizewidth_tag && !$resizeheight_tag)
      $ratio = $widthratio;
      if($resizeheight_tag && !$resizewidth_tag)
      $ratio = $heightratio;
      $newwidth = $pic_width * $ratio;
      $newheight = $pic_height * $ratio;
      if(function_exists("imagecopyresampled"))
      {
        $newim = imagecreatetruecolor($newwidth,$newheight);//PHP图片处理系统函数
        imagecopyresampled($newim,$im,0,0,0,0,$newwidth,$newheight,$pic_width,$pic_height);//PHP图片处理系统函数
      }
      else
      {
        $newim = imagecreate($newwidth,$newheight);
        imagecopyresized($newim,$im,0,0,0,0,$newwidth,$newheight,$pic_width,$pic_height);
      }
      switch ($filetype) {   
        case 'image/pjpeg' :   
        case 'image/jpeg' :   
          $result = imagejpeg($newim,$name);  
          break;   
        case 'image/gif' :   
          $result = imagegif($newim,$name);  
          break;   
        case 'image/png' :   
          $result = imagepng($newim,$name);  
          break;
        case 'image/wbmp' :   
          $result = imagewbmp($newim,$name);  
          break;       
      } 
      imagedestroy($newim);
    }
    else
    {
      switch ($filetype) {   
        case 'image/pjpeg' :   
        case 'image/jpeg' :   
          $result = imagejpeg($im,$name);  
          break;   
        case 'image/gif' :   
          $result = imagegif($im,$name);  
          break;   
        case 'image/png' :   
          $result = imagepng($im,$name);  
          break;
        case 'image/wbmp' :   
          $result = imagewbmp($im,$name);  
          break;       
      }
    }
    return $result; 
  }

总结

以上所述是小编给大家介绍的php处理多图上传压缩代码功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持！

php处理多图上传压缩代码功能

- Author -

qq_20411009

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

PHP 相关文章推荐
php设计模式 Bridge (桥接模式)
Jun 26 PHP
使用session判断用户登录用户权限(超简单)
Jun 08 PHP
php session_start()出错原因分析及解决方法
Oct 28 PHP
php 字符串压缩方法比较示例
Jan 23 PHP
yii框架配置默认controller和action示例
Apr 30 PHP
Zend Framework 2.0事件管理器（The EventManager）入门教程
Aug 11 PHP
PHP实现获取某个月份周次信息的方法
Aug 11 PHP
PHP的运行机制与原理(底层)
Nov 16 PHP
详解PHP的Yii框架中的Controller控制器
Mar 29 PHP
PHP常用操作类之通信数据封装类的实现
Jul 16 PHP
PHP重置数组为连续数字索引的几种方式总结
Mar 12 PHP
laravel框架模型中非静态方法也能静态调用的原理分析
Nov 23 PHP
Laravel框架使用Seeder实现自动填充数据功能
Jun 13 #PHP
PHP实现打包zip并下载功能
Jun 12 #PHP
PHPUnit测试私有属性和方法功能示例
Jun 12 #PHP
PHP+redis实现的悲观锁机制示例
Jun 12 #PHP
thinkPHP5框架auth权限控制类与用法示例
Jun 12 #PHP
thinkPHP5框架实现基于ajax的分页功能示例
Jun 12 #PHP
Laravel框架路由和控制器的绑定操作方法
Jun 12 #PHP
Sunmao(1) svg(1) 滚动条(1) 蓝屏(1) CAD(1) 输入法(2) 403(1) 404(1) sout(1) Sentry(1)
You might like
PHP实现补齐关闭的HTML标签
2016/03/22 PHP
php递归函数怎么用才有效
2018/02/24 PHP
PHP实现数组根据某个单元字段排序操作示例
2018/08/01 PHP
PHP数组实际占用内存大小原理解析
2020/12/11 PHP
Aster vs Newbee BO5 第三场2.19
2021/03/10 DOTA
getElementsByTagName vs selectNodes效率 及兼容的selectNodes实现
2010/02/26 Javascript
jQuery filter函数使用方法
2014/05/19 Javascript
jQuery中unbind()方法用法实例
2015/01/19 Javascript
用AngularJS的指令实现tabs切换效果
2016/08/31 Javascript
使用 jQuery.ajax 上传带文件的表单遇到的问题
2016/10/31 Javascript
在DWR中实现直接获取一个JAVA类的返回值的两种方法
2016/12/25 Javascript
详解vue渲染从后台获取的json数据
2017/07/06 Javascript
jQuery实现导航栏头部菜单项点击后变换颜色的方法
2017/07/19 jQuery
详细分析单线程JS执行问题
2017/11/22 Javascript
Node.js中,在cmd界面,进入退出Node.js运行环境的方法
2018/05/12 Javascript
js神秘的电报密码 哈弗曼编码实现
2019/09/10 Javascript
uni-app如何实现增量更新功能
2020/01/03 Javascript
JavaScript实现省份城市的三级联动
2020/02/11 Javascript
[00:56]PWL开团时刻DAY8——追追追追追！
2020/11/09 DOTA
Python3字符串学习教程
2015/08/20 Python
Python第三方库的安装方法总结
2016/06/06 Python
Python 字符串大小写转换的简单实例
2017/01/21 Python
Python中的 enum 模块源码详析
2019/01/09 Python
对python:循环定义多个变量的实例详解
2019/01/20 Python
Python3.5字符串常用操作实例详解
2019/05/01 Python
HTML5中使用json对象的实例代码
2018/09/10 HTML / CSS
Vans英国官方网站：美国南加州的原创极限运动潮牌
2017/01/20 全球购物
西班牙床垫网上商店：Colchones.es
2018/05/06 全球购物
总经理助理职责
2014/02/04 职场文书
家长寄语大全
2014/04/02 职场文书
安装工程师岗位职责
2015/02/13 职场文书
2015年前台个人工作总结
2015/04/03 职场文书
春风化雨观后感
2015/06/11 职场文书
css背景和边框标签实例详解
2021/05/21 HTML / CSS
浅谈Python中对象是如何被调用的
2022/04/06 Python
MySQL慢查询中的commit慢和binlog中慢事务的区别
2022/06/16 MySQL