thinkphp5.1.38+cropper.min.js图片压缩剪切代码
很多项目都需要对图片进行处理,比如图片上传并裁剪的功能,之前也有接触过很多图片裁剪插件,效果体验不是很好,今天推荐一款好用的插件-cropper,超级好用,裁剪功能丰富,满足了各种需求。
应用介绍
应用介绍
thinkphp5.1.38 LTS版本
const VERSION = '5.1.38 LTS';
前端代码:html+js图片剪切库:cropper.min.js
<div class="container" id="crop-avatar">
<div class="avatar-view" title="修改头像">
<img src="/upload/attachment/2019.08.25/picture.png" alt="头像">
</div>
<div class="modal fade" id="avatar-modal" aria-hidden="true" aria-labelledby="avatar-modal-label" role="dialog" tabindex="-1">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form class="avatar-form" action="{:url('index/index/img_upload', '', '')}" enctype="multipart/form-data" method="post">
<div class="modal-header">
<button class="close" data-dismiss="modal" type="button">×</button>
<h4 class="modal-title" id="avatar-modal-label">修改 头像</h4>
</div>
<div class="modal-body">
<div class="avatar-body">
<div class="avatar-upload">
<input class="avatar-src" name="file_img" type="hidden">
<input class="avatar-data" name="avatar_data" type="hidden">
<label for="avatarInput">本地上传</label>
<input class="avatar-input" accept="image/*" id="avatarInput" name="avatar_file" type="file">
</div>
<div class="row">
<div class="col-md-9">
<div class="avatar-wrapper"></div>
</div>
<div class="col-md-3">
<div class="avatar-preview preview-lg"></div>
<div class="avatar-preview preview-md"></div>
<div class="avatar-preview preview-sm"></div>
</div>
</div>
<div class="row avatar-btns">
<div class="col-md-9">
<div class="btn-group">
<button class="btn btn-primary" data-method="rotate" data-option="-90" type="button" title="Rotate -90 degrees">左旋转</button>
<button class="btn btn-primary" data-method="rotate" data-option="-15" type="button">-15度</button>
<button class="btn btn-primary" data-method="rotate" data-option="-30" type="button">-30度</button>
<button class="btn btn-primary" data-method="rotate" data-option="-45" type="button">-45度</button>
</div>
<div class="btn-group">
<button class="btn btn-primary" data-method="rotate" data-option="90" type="button" title="Rotate 90 degrees">右旋转</button>
<button class="btn btn-primary" data-method="rotate" data-option="15" type="button">15度</button>
<button class="btn btn-primary" data-method="rotate" data-option="30" type="button">30度</button>
<button class="btn btn-primary" data-method="rotate" data-option="45" type="button">45度</button>
</div>
</div>
<div class="col-md-3">
<button class="btn btn-primary btn-block avatar-save" type="submit">剪切</button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="loading" aria-label="Loading" role="img" tabindex="-1"></div>
</div>
thinkphp5.1.38版本
thinkphp5.1.38图片压缩剪切代码,生成后返回一张缩略图,三张压缩图,一张原图。
<?php
namespace appindexcontroller;
use thinkController;
use thinkfacadeEnv;
use thinkfacadeValidate;
use thinkfacadeConfig;
class Index extends Controller
{
//您可以进行图片压缩和剪切封装
public function index()
{
// 不带任何参数 自动定位当前操作的模板文件
return $this->fetch();
}
/**
* 单文件上传
* name:表单上传文件的名字
* ext: 文件允许的后缀,字符串形式
* path:文件保存目录
*/
public function file_upload($name,$ext,$path){
//根目录+配置的运行目录
$root_path = Env::get('root_path') . Config::get("app.public_path");
$dir_path = $root_path . DIRECTORY_SEPARATOR . 'upload' . DIRECTORY_SEPARATOR . $path;
if (!is_dir($dir_path))mkdir($dir_path, 0777);// 使用最大权限0777创建文件
$file = request()->file($name);
$info = $file->validate(['size'=>1000000,'ext'=>$ext])->move($dir_path . DIRECTORY_SEPARATOR . date('Y') . DIRECTORY_SEPARATOR . date('md'), md5(microtime(true)));
if($info){
// 成功上传后 获取上传信息
$save_name = $info->getSaveName();
$data['file_path'] = DIRECTORY_SEPARATOR .'upload' . DIRECTORY_SEPARATOR . $path . DIRECTORY_SEPARATOR .date('Y') . DIRECTORY_SEPARATOR . date('md'). DIRECTORY_SEPARATOR .$save_name;
$data['save_path'] = DIRECTORY_SEPARATOR . 'upload' . DIRECTORY_SEPARATOR . $path . DIRECTORY_SEPARATOR .date('Y') . DIRECTORY_SEPARATOR . date('md');
$data['save_name'] = $save_name;
}else{
// 上传失败获取错误信息
$data['file_path'] =$info->getError();
}
return $data;
}
/*
* 图片上传接口
*/
public function img_upload(){
$avatar_data = $this->request->post('avatar_data');
$avatar_data = json_decode($avatar_data, true);
if(!empty($_FILES["avatar_file"]["name"]))
{
if($_FILES["avatar_file"]['size'] === 0){
return json(['code' => '0', 'message' => '非法文件!']);
}
$file_mes = $this->file_upload('avatar_file','jpg,png,gif,jpeg','avatar');
$file_path = $file_mes['file_path'];
$save_name = $file_mes['save_name'];
$save_path = $file_mes['save_path'];
//图片压缩
$data['prize_img'] = $file_path;
$data['prize_img_view'] = Config::get("app.host_url").$file_path;
$data['prize_img_400'] = $this->file_upload_thumb($file_path, 400, 400, $save_path, $save_name);
$data['prize_img_200'] = $this->file_upload_thumb($file_path, 200, 200, $save_path, $save_name);
$data['prize_img_150'] = $this->file_upload_thumb($file_path, 150, 150, $save_path, $save_name);
//图片剪切
if($avatar_data)
{
$data['prize_img_crop'] = $this->file_upload_crop($avatar_data['width'], $avatar_data['height'], $avatar_data['x'], $avatar_data['y'], $file_path, $save_path, $save_name);
}
//反斜杠替换
$return_data = str_replace('','/',$data);
return json(['code' => '1', 'message' => '上传成功','result'=>$return_data]);
}
else
{
return json(['code' => '2', 'message' => '图片不能为空!','result'=>null]);
}
}
public function file_upload_crop($width, $height, $x, $y, $file_path, $save_path, $save_name){
//根目录+配置的运行目录
$root_path = Env::get('root_path') . Config::get("app.public_path");
$file_path = $root_path.$file_path;
$image = thinkImage::open($file_path);//绝对路径
$save_url = $save_path.DIRECTORY_SEPARATOR.'crop_'.$save_name;
$save_name = $root_path.$save_url;
$image->crop($width, $height, $x, $y)->save($save_name);
return $save_url;
}
/**
* 图片缩略图处理
* file_path:文件路径
* width :目标宽度
* height:目标高
* path:文件保存目录 : 需事先手动创建
*/
public function file_upload_thumb($file_path, $width, $height, $save_path, $save_name){
//根目录+配置的运行目录
$root_path = Env::get('root_path') . Config::get("app.public_path");
$file_path = $root_path.$file_path;
$image = thinkImage::open($file_path);//绝对路径
$save_url = $save_path.DIRECTORY_SEPARATOR.$width."_".$height.'_thumb_'.$save_name;
$save_name = $root_path.$save_url;
$image->thumb($width, $height)->save($save_name);
return $save_url;
}
}
©软件著作权归作者所有。本站所有软件均来源于网络,仅供学习使用,请支持正版!
转载请注明出处: 我的网站 » thinkphp5.1.38+cropper.min.js图片压缩剪切代码
发表评论 取消回复