githen/laravel-upload

基于Dropzone为laravel提供上传支持

v1.3.8 2025-03-20 06:23 UTC

This package is auto-updated.

Last update: 2025-03-20 06:24:19 UTC


README

基于Dropzone为laravel提供上传支持

image image image

安装

composer require githen/laravel-upload:~v1.3.0

# 迁移配置文件
php artisan vendor:publish --provider="Githen\LaravelUpload\UploadProvider"

配置文件说明

config/filesystem.php中添加目录public配置项

'localFile' => [
        'driver' => 'local',
        'root' => public_path(),
        'url' => config('app.url'), // 生成url前缀
        'permissions' => [
            'file' => [
                'public' => 0770,
                'private' => 0600,
            ],
            'dir' => [
                'public' => 0770,
                'private' => 0700,
            ],
        ],
    ],

生成upload.php上传配置文件

return [
    /**
    |--------------------------------------------------------------------------
    | 文件上传配置
    |--------------------------------------------------------------------------
    |  '标识' => [
     *      'size' => 3, //文件大小上限  类型int 单位MB
     *      'ext' => ['png', 'jpg']  // 支持的文件类型,类型array
     *      'resize' => [200, 200]  // 若为图片类型,自动处理图片为200X200
     *      'path' => 'uploads/'. date('Y/m/d'),  // 文件实际存储目录
     * ]
     */
    'global' => [
        'tmp' => 'uploads/tmp', // 临时目录,在表单提交时再将文件移动到path目录
        'path' => 'uploads', // 实际存储目录
        'name' => 'file',  // 文件上传时文件对应的key
        'auth' => ['auth'],  // 上传controller加载的中间件
        'filesystem' => 'localFile', // 使用的文件系统
        'thumb' => 'thumb', // 图片类型缩略图名称,a.png => a_thumb.png
    ],

    'img' => [
        'size' => 3, // MB
        'ext' => ['.png', '.jpg', '.jpeg', '.zip'],
        'resize' => [200,200], // 原图等比压缩,只有图片格式有效,不配置使用原图
        'thumb_resize' => [200,200], // 生成缩略图,只有图片格式有效,不配置则不生成
        'path' => 'uploads/'. date('Y/m/d'),
    ]
];

初始化上传实例

自动发现功能将在6.0.0中删除,如果依赖此功能,需要手动关闭。默认生成的JS已处理,可忽略。

Dropzone.autoDiscover = false; 

html中引入JS文件

<script src=".../dropzone.min.js"></script>
<script src="/app-assets/js/scripts/forms/uploadzone.js"></script>

进行实例化

myDropzone = new uploadzone({
    dom: '#dpz-single-file',
    paramName: "{!! config('upload.global.name') !!}",
    acceptedFiles:"{!! implode(',', config('upload.img.ext')) !!}",
    
    // param为上传关联配置的标识 ,必填 
    // is_tmp 决定使用哪个目录,false时,使用path配置目录,true时使用tmp目录
    url:"{!! route('jiaoyu.upload',['param' => 'img', 'is_tmp'=>true]) !!}",
    csrf:true,
    
    // 成功回调,可通过此方法处理返回文件信息
    success:function (file){
        if (file.status === "success"){
            var response = JSON.parse(file.xhr.response);
        }
    },
    
    // 失败回调,以下为默认方法,如不修改可省略
    error:function (file, data){
        if (file.previewElement){
            let message = data;
            if (typeof data.message !== "undefined") message = data.message
            if (typeof message !== "string" && message.error) {
                message = message.error;
            }
            for (let node of file.previewElement.querySelectorAll(
                "[data-dz-errormessage]"
            )) {
                node.textContent = message;
            }
        }
    },
    // 删除文件
    removedfile:function(file){


    },
    // 超过maxFiles限制回调处理
    maxfilesexceeded:function(file){

    }
})
参数 名称 说明 备注
dom 实例化的DOM标识 必填
csrf POST提交时的csrf验证 非必填
true
false
acceptedFiles 允许上传文件后缀(.jpg,.png) 默认为.zip
url 上传地址 {!! route('jiaoyu.upload',['param' => 'img', 'is_tmp'=>true]) !!} param:标识(以此标识从upload.php中获取配置信息)
is_tmp:是否使用临时目录(tmp),为false使用path目录
paramName 上传的属性名称 非必填,默认:file
chunkSize 分片大小 单位:MB,默认2MB
maxFiles 最多上传文件数 非必填,默认:1
maxFilesize 文件最大限制 非必填,单位:MB,默认10MB,
chunking 是否分片
forceChunking 上传时显示文件详情,不可修改
dictDefaultMessage 默认提示语 拖动文件至此处或点击上传
dictMaxFilesExceeded 超过限制上传数量提示语 您最多上传的文件数为 + maxFiles
dictResponseError 上传失败提示语 文件上传失败!
dictInvalidFileType 文件类型提示语 文件类型支持
dictFallbackMessage 兼容性提示语 浏览器不支持
dictFileTooBig 文件过大提示语 文件过大,最大支持 + maxFilesize + MB
dictRemoveFile 删除提示语 删除
addRemoveLinks 添加删除连接
previewsContainer 预览容器
previewTemplate 预览生成模板
thumbnailWidth 插件中,展示图宽度 默认:120
thumbnailHeight 插件中,展示图高度 默认:120

临时目录迁移到正式目录

如果上传的文件是放在临时目录tmp下,则在实际业务中,需要进行迁移文件到正式目录。可执行以下操作完成迁移操作。

//app('jiaoyu.move') 以单例形貌注入,执行迁移操作
// $from 文件地址
// $to    需要迁移到的目录
// 如果存在缩略图,一并迁移 
$result = app('jiaoyu.upload')->move($from, $to);

// 返回数据结构
[
    "code" => 0, // 0 成功 1失败
    "message" => "成功", // 执行说明
    "path" => '', // 新文件的目录,缩略图默认在文件名后加入缩略图标识,`upload.global.thumb`
]

删除文件

// $file 要删除的文件
$result = app('jiaoyu.upload')->remove($file);

// 返回数据结构
[
    "code" => 0, // 0 成功 1失败
    "message" => "成功删除", // 执行说明
]