老莫的笔记本  
  
查看: 1171|回复: 4

TP5 topthink/think-image 图像处理软件的坑

[复制链接]

662

主题

878

帖子

5145

积分

超级版主

Rank: 8Rank: 8

积分
5145
发表于 2018-9-28 16:46:53 | 显示全部楼层 |阅读模式
安转以及 正确使用:
先掰扯掰扯 怎么用它,在大千世界中,茫茫人海中,周大胖子终于找到了这个插件的用法,1.安装:cd 到 项目根目录, 运行cmd
  1. composer require topthink/think-image
复制代码
2.引入 : use think\Image ;
3.使用 :
  1. $image = Image::open(ROOT_PATH.'public'.DS.'uploads'.DS.'images'.DS.$info->getSaveName()) ;
  2.                 // 生成缩略图  [有一个坑点 : 我没有thumb 文件夹 它并不自动创建]
  3.                 $image->thumb(150, 150, Image::THUMB_SCALING)->save(ROOT_PATH.'public/uploads/images/thumb/m-'.$info->getFilename().'.jpg');
  4.                 // 给图片加水印 参数为 水印的logo 所在的位置 可接save 函数 单独存储到别的地方
  5.                 $image->water(ROOT_PATH.'public'.DS.'uploads'.DS.'images'.DS.'logo'.DS.'/logo.png')->save(ROOT_PATH.'public/uploads/images/water/w-'.$info->getFilename().'.jpg');
复制代码
【注意!注意!注意! 存放的文件夹必须TMD存在 否则死都不知道怎么死】
回复

使用道具 举报

662

主题

878

帖子

5145

积分

超级版主

Rank: 8Rank: 8

积分
5145
 楼主| 发表于 2018-9-28 16:48:36 | 显示全部楼层
附一个上传源代码
  1. <?php
  2. namespace app\index\controller;
  3. use think\Controller;
  4. use think\Request;
  5. use think\Image;
  6. class Index extends Controller
  7. {
  8.    
  9.     public function up()
  10.     {
  11.         return $this->fetch();
  12.     }
  13.     public function doup(Request $request)
  14.     {
  15.         $file = $request->file('file');
  16.         $rules = [
  17.                 'ext'   =>  'jpg,png,gif'   //上传格式限制
  18.                 ,'size' =>  1024*1024*2    //上传大小限制 这是 2MB
  19.         ];
  20.         if($file){
  21.             $info = $file->validate($rules)->move(ROOT_PATH.'public'.DS.'uploads'.DS.'images');
  22.             if($info){
  23.                 $data =[
  24.                     'url'  =>  DS.'uploads'.DS.'images'.DS.$info->getSaveName(),
  25.                 ];
  26.                 // 打开上传图片[在这里有个坑 下一句是错的 应该是相对于已经move完的图片] open(图片具体位置)
  27.                
  28.                 $image = Image::open(ROOT_PATH.'public'.DS.'uploads'.DS.'images'.DS.$info->getSaveName()) ;
  29.                 // 生成缩略图  [有一个坑点 : 我没有thumb 文件夹 它并不自动创建]
  30.                 $image->thumb(150, 150, Image::THUMB_SCALING)->save(ROOT_PATH.'public/uploads/images/thumb/m-'.$info->getFilename().'.jpg');
  31.                 // 给图片加水印 参数为 水印的logo 所在的位置 可接save 函数 单独存储到别的地方
  32.                 $image->water(ROOT_PATH.'public'.DS.'uploads'.DS.'images'.DS.'logo'.DS.'/logo.png')->save(ROOT_PATH.'public/uploads/images/water/w-'.$info->getFilename().'.jpg');
  33.                 exit( json(0,'上传成功',1, $data));
  34.             }else{
  35.                 exit( json(0,'上传失败') );
  36.             }
  37.         }else{
  38.             exit( json(0,'上传失败') );
  39.         }
  40.     }
  41. }
复制代码
需要先安装 指定模块

回复

使用道具 举报

662

主题

878

帖子

5145

积分

超级版主

Rank: 8Rank: 8

积分
5145
 楼主| 发表于 2018-9-28 16:50:01 | 显示全部楼层
再添加一个简单的、独立的前台 部分
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4.     <meta charset="utf-8">
  5.     <title>一个简单的上传图片的前台代码</title>
  6. </head>
  7. <body>
  8.     <div>
  9.         <form  id="infoLogoForm" action="">
  10.             <input type="file" name="file"  accept="image/*" id="lao-up" />
  11.             <img width="320" id="showImg" alt="" />
  12.         </form>
  13.     </div>
  14.     <!-- 进度条 -->
  15.     <progress id="progressBar" value="20" max="100" > </progress>
  16.     <script src="https://lib.baomitu.com/jquery/3.3.1/jquery.min.js"></script>
  17.     <script>
  18.             var uploading = false; //判断是否正在上传文件
  19.             $("#lao-up").on("change", function(){
  20.                 if(uploading){
  21.                     alert("文件正在上传中,请稍候");
  22.                     return false;
  23.                 }
  24.                 $.ajax({
  25.                     url: "./doup",
  26.                     type: 'POST',
  27.                     cache: false,
  28.                     data: new FormData($('#infoLogoForm')[0]),
  29.                     processData: false,
  30.                     contentType: false,
  31.                     dataType:"json",
  32.                     beforeSend: function(){
  33.                         uploading = true;  //上传之前防止重复上传
  34.                     },
  35.                     success : function(e) {
  36.                         console.log(e)
  37.                         $('#showImg').attr('src','/public' + e['data']['url'])
  38.                         uploading = false;
  39.                     }
  40.                     , error : function(err)
  41.                     {
  42.                         alert('上传失败 尴尬不?');
  43.                         uploading = false;
  44.                     }
  45.                 });
  46.             });
  47.     </script>
  48. </body>
  49. </html>
复制代码

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回顶部 返回列表