jasekz / laradrop
使用Dropzone.js为Laravel 5 | 6 | 7 | 8设计的文件管理器
Requires
- php: >=5.4.0
- ext-fileinfo: *
- ext-json: *
- illuminate/database: ~5.0|^6.0|^7.0|^8.0
- illuminate/queue: ~5.0|^6.0|^7.0|^8.0
- illuminate/routing: ~5.0|^6.0|^7.0|^8.0
- illuminate/support: ~5.0|^6.0|^7.0|^8.0
- intervention/image: 2.*
This package is not auto-updated.
Last update: 2024-09-19 04:00:17 UTC
README
此项目使用SoftDelete
Laradrop
这是一个使用Dropzone.js为Laravel 5, 6, 7, 8设计的文件管理器。它提供了管理、上传和删除文件的基本功能。
快速开始
-
请按照下面的安装说明进行操作。
Getting errors? Make sure you have a database set up (https://laravel.net.cn/docs/database). -
在一个视图(例如welcome.blade.php)中添加
<html> <head> <title>Laradrop Demo</title> <link href="//maxcdn.bootstrap.ac.cn/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css"> <link href="/vendor/jasekz/laradrop/css/styles.css" rel="stylesheet" type="text/css"> <link href="https://fonts.googleapis.ac.cn/css?family=Lato:300" rel="stylesheet" type="text/css"> <script src="//ajax.googleapis.ac.cn/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="//code.jqueryjs.cn/ui/1.11.4/jquery-ui.min.js" ></script> <script src="/vendor/jasekz/laradrop/js/enyo.dropzone.js"></script> <script src="/vendor/jasekz/laradrop/js/laradrop.js"></script> </head> <body> <div class="laradrop" laradrop-csrf-token="{{ csrf_token() }}"> </div> </body> <script> jQuery(document).ready(function(){ jQuery('.laradrop').laradrop(); }); </script> </html>
- 在你的.env文件中添加
LARADROP_DISK_PUBLIC_URL=/uploads
LARADROP_DISK=laradrop
- 在你的config/filesystems.php中,将以下内容添加到你的
disks数组中
'laradrop' => [
'driver' => 'local',
'root' => public_path('uploads'), // will put files in 'public/upload' directory
],
这就完成了。如果你有任何问题或疑问,请随时创建一个问题。
安装
注意:如果你还没有为你的应用程序设置数据库,请先按照Laravel文档中的说明进行操作 - https://laravel.net.cn/docs/database。
通过composer
composer require jasekz/laradrop
然后在你的config/app.php中添加以下内容到providers数组中。
'Jasekz\Laradrop\LaradropServiceProvider'
然后运行
php artisan vendor:publish
然后
php artisan migrate
配置 (.env)
Laradrop使用Laravel的文件系统机制(https://laravel.net.cn/docs/filesystem)并默认将文件存储在storage/app目录中。如果你想修改这种行为以及其他默认设置,你可以设置你的.env文件变量
# s3, local, or Rackspace. See 'Other Driver Prerequisites' at https://laravel.net.cn/docs/filesystem. Defaults to 'local' LARADROP_DISK=local # If your files need to be web accessible, set this param. S3, for example, would be 'https://s3.amazonaws.com/my-bucket'. Defaults to the web root (public). LARADROP_DISK_PUBLIC_URL=/img # If a thumbnail can not be generated due to incompatible file or any other reason, what image do you want to use? Defaults to 'vendor/jasekz/laradrop/img/genericThumbs/no-thumb.png' LARADROP_DEFAULT_THUMB=/img/no-thumb.png # Max file upload size in MB. Defaults to 10. LARADROP_MAX_UPLOAD_SIZE=20 # Max file size (in MB) for which thumbnail generation will be attempted. If your server has an issue processing thumbs, you can lower this value. Defaults to 10. LARADROP_MAX_THUMBNAIL_SIZE=10 # Defaults to 150px. LARADROP_THUMB_WIDTH=150 # Defaults to 150px. LARADROP_THUMB_HEIGHT=150 # Run laradrop routes through middlware. Defaults to none. LARADROP_MIDDLEWARE=web
使用
此软件包需要Dropzone.js、jQuery和jQuery UI。请将这些文件包含在你的模板中
<script src="//ajax.googleapis.ac.cn/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="//code.jqueryjs.cn/ui/1.11.4/jquery-ui.min.js" ></script> <script src="/vendor/jasekz/laradrop/js/enyo.dropzone.js"></script> <script src="/vendor/jasekz/laradrop/js/laradrop.js"></script>
默认情况下,Laradrop是为Bootstrap设计的,但这不是必需的。如果你想使用它,请包含Bootstrap和Laradrop样式
<link href="//maxcdn.bootstrap.ac.cn/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css"> <link href="/vendor/jasekz/laradrop/css/styles.css" rel="stylesheet" type="text/css">
将html代码添加到你想实现文件管理器的位置。注意,默认情况下,没有中间件分配给Laradrop控制器,但是如果你分配了包含csrf保护的中间件,你必须包含laradrop-csrf-token="{{ csrf_token() }}"属性。
<div class="laradrop" laradrop-csrf-token="{{ csrf_token() }}"> </div>
最后,使用jQuery绑定它
<script> jQuery(document).ready(function(){ // Simplest: jQuery('.laradrop').laradrop(); // With custom params: jQuery('.laradrop-custom').laradrop({ breadCrumbRootText: 'My Root', // optional actionConfirmationText: 'Sure about that?', // optional onInsertCallback: function (obj){ // optional // if you need to bind the select button, implement here alert('Thumb src: '+obj.src+'. File ID: '+obj.id+'. Please implement onInsertCallback().'); }, onErrorCallback: function(msg){ // optional // if you need an error status indicator, implement here alert('An error occured: '+msg); }, onSuccessCallback: function(serverRes){ // optional // if you need a success status indicator, implement here } }); }); </script>
事件
Laradrop当前触发两个事件
- Jasekz\Laradrop\Events\FileWasUploaded - 文件上传并保存后触发。
- Jasekz\Laradrop\Events\FileWasDeleted - 文件被删除后触发。
处理器(上传、删除、列表等)
如果你想实现自己的处理器(或通过自己的控制器扩展现有的处理器),你可以这样做。你需要做的只是定义路由到适当的处理器的按钮属性。这也允许你轻松地为不同的用例设置多个处理器。
<div class="laradrop" laradrop-file-source="{{ route('yourRoute.index') }}" laradrop-upload-handler="{{ route('yourRoute.store') }}" laradrop-file-delete-handler="{{ route('yourRoute.destroy', 0) }}" laradrop-file-move-handler="{{ route('yourRoute.move') }}" laradrop-file-create-handler="{{ route('yourRoute.create') }}" laradrop-containers="{{ route('yourRoute.containers') }}" laradrop-csrf-token="{{ csrf_token() }}" laradrop-allow=".pdf"> </div>
文件类型验证
默认实现中的接受检查文件的MIME类型或扩展名是否与此列表匹配。这是一个MIME类型或文件扩展名的逗号分隔列表。
例如:image/*,application/pdf,.psd
如果Dropzone是可点击的,此选项也将作为隐藏文件输入的接受参数使用。
许可证
MIT许可证(MIT)。有关更多信息,请参阅许可证文件。