图片上传、限制、裁剪功能

用户肯定都要有自己的头像，这就涉及到了图片的上传、裁剪等，其实很容易实现。

图片上传

直接使用file类型的input标签即可，我们可以通过accept属性来限制上传的文件类型，但是一般避免使用此属性，建议在服务器端验证文件上传。

<input type="file" name="avatar" accept="image/png, image/jpeg">

这里有一点要注意，图片或文件上传时，必须为表单添加enctype声明，否则请求对象$request获取的就会是图片名称。

<form action="{{ route('users.update', $user->id) }}" method="POST" accept-charset="UTF-8" enctype="multipart/form-data">

可以在控制器中直接使用请求对象Request来获取上传的文件

$file = $request->avatar; //avatar就是input标签的name属性值

但是，肯定不能获取到图片后直接存到数据库，那就太愚蠢了。一般情况下，图片上传功能是系统中经常使用的功能，所以可以将图片上传做成一个工具类，需要用到的时候就直接调用即可。

namespace App\Handlers; use Illuminate\Support\Str; class ImageUploadHandler { // 只允许以下后缀名的图片文件上传 protected $allowed_ext = ["png", "jpg", "gif", 'jpeg']; public function save($file, $folder, $file_prefix) { //路径 $folder_name = "uploads/images/$folder/" . date("Ym/d", time()); $upload_path = public_path() . '/' . $folder_name; // 获取文件的后缀名，因图片从剪贴板里黏贴时后缀名为空，所以此处确保后缀一直存在 $extension = strtolower($file->getClientOriginalExtension()) ?: 'png'; // 文件名 $filename = $file_prefix . '_' . time() . '_' . Str::random(10) . '.' . $extension; // 如果上传的不是图片将终止操作 if ( ! in_array($extension, $this->allowed_ext)) { return false; } // 将图片移动到我们的目标存储路径中 $file->move($upload_path, $filename); return [ 'path' => config('app.url') . "/$folder_name/$filename" ]; } }

接下来就可以在控制器中调用预先定义的图片上传工具类了。

use App\Handlers\ImageUploadHandler; class UsersController extends Controller { . . . public function update(UserRequest $request, ImageUploadHandler $uploader, User $user) { $data = $request->all(); if ($request->avatar) { $result = $uploader->save($request->avatar, 'avatars', $user->id); if ($result) { $data['avatar'] = $result['path']; } } $user->update($data); return redirect()->route('users.show', $user->id)->with('success', '图片上传成功！'); } }

图片格式、分辨率限制

图片的格式、分辨率等可以很巧妙的通过表单验证功能进行限制。

public function rules() { return [ 'name' => 'required|between:3,25|regex:/^[A-Za-z0-9\-\_]+$/|unique:users,name,' . Auth::id(), ]; } public function messages() { return [ 'avatar.mimes' =>'头像必须是 jpeg, bmp, png, gif 格式的图片', 'avatar.dimensions' => '图片的清晰度不够，宽和高需要 208px 以上', ]; }

图片的裁剪

composer备受推崇的主要原因就是可以方便的安装扩展包并处理好依赖关系，而此处图片的裁剪我们就通过composer安装一个叫Intervention/image的扩展包来处理图片的裁剪。

Composer安装扩展包

compser require intervention/image

必须在图片处理类里引用Image包，直接调用其中封装好的方法即可。

//裁剪方法 public function reduceSize($file_path, $max_width) { // 先实例化，传参是文件的磁盘物理路径 $image = Image::make($file_path); // 进行大小调整的操作 $image->resize($max_width, null, function ($constraint) { // 设定宽度是 $max_width，高度等比例缩放 $constraint->aspectRatio(); // 防止裁图时图片尺寸变大 $constraint->upsize(); }); // 对图片修改后进行保存 $image->save(); }