kirill-dan / uploadimage
将图像上传到内容类型文件夹。
v2.0.2
2018-09-06 17:17 UTC
Requires
- php: >=7.0
- spatie/laravel-glide: ^3.0
README
适用于 Laravel 5.3 / 5.4 / 5.5
此包为您提供了以下机会
- 轻松上传图像文件到内容类型文件夹
- 为您的图像创建缩略图
- 您可以轻松地从磁盘加载任何内容类型的图像(原始图像或缩略图图像)
- 您可以轻松地从磁盘删除您的图像
- 您可以轻松地从包含相对链接的图像的正文文本中删除所有图像
- 您可以轻松创建预览图像,而不需要在磁盘上存储图像
- 您可以使用 AJAX 在 WYSIWYG 编辑器中轻松上传/删除图像
- 您可以轻松地在图像上添加水印
- 您可以将图像存储在磁盘上或在数据库中以 Base64 格式存储
历史
- v2.0.1 - 在方法中分配缩略图:upload($file, $contentName, $watermark = false, $video = false, $thumbnails = false)
- v2.0 - 支持 Laravel 5.5
- v1.0.70 - 添加到配置 'watermarkEditorStatus' 以用于 WYSIWYG 编辑器。更改 UploadImageController
- v1.0.61 - 获取真实图像扩展名。
- v1.0.50 - 您可以禁用或启用水印。请参见下面的示例。
- v1.0.5 - 修复检查文件上的图像。
- v1.0.4 - 重构所有代码。添加异常,将数组更改为方法。修复一些错误。
- v1.0.3 - 修复一些错误。
- v1.0.2 - 替换在表单中显示图像预览的功能,方法 upload 返回错误状态,如果图像宽度小于设置文件中的图像宽度
- v1.0.1 - 修复一些错误
需求
- spatie/laravel-glide
- php gd 库
安装包
将包添加到您的项目
composer require kirill-dan/uploadimage 2.*
将以下条目添加到文件 config/app.php
提供者部分
'providers' => [ ....... Spatie\Glide\GlideServiceProvider::class, Dan\UploadImage\UploadImageServiceProvider::class, ]
外观部分
'aliases' => [ ....... 'GlideImage' => Spatie\Glide\GlideImageFacade::class, 'UploadImage' => Dan\UploadImage\UploadImageFacade::class, ]
在终端中输入以下命令
php artisan vendor:publish --provider="Dan\UploadImage\UploadImageServiceProvider"
将复制两个文件
config/upload-image.php - 这是 UploadImage 包的设置
resources/assets/js/upload_image_preview.js - 您应该将其包含到 elixir/mix 中
打开文件 webpack.mix.js 并将 upload_image_preview.js 添加到数组中。例如
mix.sass('resources/assets/sass/app.scss', 'public/css/app.css').version(); mix.js(['resources/assets/js/app.js', 'resources/assets/js/upload_image_preview.js'], 'public/js/all.js').version();
在终端中执行命令(用于生产)
npm run production
在您想要使用 UploadImage 的控制器中添加命名空间 Facade
use UploadImage;
如果您想在文件输入字段中选择图像后查看预览图像,则将文件输入字段包裹在以下代码中
<div class="image-preview-block">
<div class="image-preview-image"></div>
{!! Form::file('image', ['class' => 'image-preview-input']) !!}
</div>
您可以使用以下方法
从文件表单将图像上传到磁盘
/** * Upload image to disk. * * @param $file object instance image or image string * @param $contentName string content name (use for create and named folder) * @param bool $watermark bool watermark status (by default = false) * @param bool $video if true then add watermark with video player image to an image * @param bool $thumbnails create thumbnails for original image * * @return object image * @throws UploadImageException */ UploadImage::upload($file, $contentName, $watermark = false, $video = false, $thumbnails = false)
例如:将以下内容添加到您的控制器中
use UploadImage;
use Dan\UploadImage\Exceptions\UploadImageException;
$file = $request->file('image'); $video = $rubric->name == 'Video' ? true : false; $watermark = true; $thumbnail = true; // Upload and save image. try { // Upload and save image. $input['image'] = UploadImage::upload($file, 'post', $watermark, $video, $thumbnail)->getImageName(); } catch (UploadImageException $e) { return back()->withInput()->withErrors(['image', $e->getMessage()]); }
从磁盘删除您的图像
/** * Delete image from disk. * * @param $imageName string image name or array with images * @param $contentName string content name (use for folder and name) * */ UploadImage::delete($imageName, $contentName);
例如
// Delete old image. UploadImage::delete($post->image, 'post');
从正文文本中删除您的图片
/** * Delete body images from disk. * * @param $textBody string with text where there images * */ UploadImage::deleteBody($textBody);
例如
// Delete all images from post body (added in editor). UploadImage::deleteBody($post->body);
从磁盘加载您的图片
/** * Create path to image. * * @param $contentName string content name (use for folder and name) * @param null $size integer width for image (use one of thumbnail array) * * @return mixed */ UploadImage::load($contentName, $size = null);
例如
// Give all data to template. return view('posts.index', [ 'posts' => $posts, 'path' => UploadImage::load('post') ]);
以Base64格式获取预览图片
/** * Preview image for form. * * @param $file object instance image * @param $contentName string content name (use for folder and name) * * @return array new image stream Base64 */ UploadImage::preview($file, $contentName);
例如
// Get image preview. $image_url = UploadImage::preview($file, 'collage_image');
您可以使用next路由
// Save image from WYSIWYG editor.
ajax/uploader/upload
// Delete image from WYSIWYG editor.
ajax/uploader/delete
// Create preview image for form (use wraper, see above).
ajax/uploader/preview
例如
// Upload files on the server and get url images. function uploadFile(filesForm) { data = new FormData(); // Add all files from form to array. for (var i = 0; i < filesForm.length; i++) { data.append("files[]", filesForm[i]); } $.ajax({ data: data, type: "POST", url: "/ajax/uploader/upload", cache: false, headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}, contentType: false, processData: false, success: function (images) { // Get all images and insert to editor. for (var i = 0; i < images['url'].length; i++) { // Insert image into summernote. editor.summernote('insertImage', images['url'][i], function ($image) { //$image.css('width', $image.width() / 3); //$image.attr('data-filename', 'retriever') }); } } }); } // Delete file from the server. function deleteFile(file) { data = new FormData(); data.append("file", file); $.ajax({ data: data, type: "POST", url: "/ajax/uploader/delete", cache: false, headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}, contentType: false, processData: false, success: function (image) { //console.log(image); } }); }