Laravel + Dropzonejs + pionl/laravel-chunk-upload で大容量ファイルのアップロード

https://github.com/pionl/laravel-chunk-upload

https://github.com/pionl/laravel-chunk-upload/wiki

 

===== インストール編  ======

1. SSHでサーバーにログインし以下のコマンドを打つ

composer require pion/laravel-chunk-upload

2.  Config/app.phpを開き、Providers[]の中に以下を追加

\Pion\Laravel\ChunkUpload\Providers\ChunkUploadServiceProvider::class

 3.  再びコマンドで以下を打つ

php artisan vendor:publish --provider="Pion\Laravel\ChunkUpload\Providers\ChunkUploadServiceProvider"

/configの下に、chunk-upload.phpが作成される。

 

===== プログラム編  ======

4. web.phpに以下を追加

Route::post('/upload', 'UploadController@upload');

 

5. UploadControllerを作成

php artisan make:controller UploadController.php

以下のURLからコピーし、作成したUploadController.phpに貼り付ける

https://github.com/pionl/laravel-chunk-upload-example/blob/master/app/Http/Controllers/UploadController.php

 

6.  Dropzone.jsの通常のコードに以下を追加

 Dropzone.options.bookImportDropzone = {
   maxFilesize: 1000, //1GB
   chunking: true, //chunkアップロードに変更
   method: "POST",
   chunkSize: 2000000, //2MB
   parallelChunkUploads: false, ←★trueにしないと駄目

           retryChunks: true,
           retryChunksLimit: 3,
           chunksUploaded: function (file, done) {

                var response = JSON.parse(file.xhr.response);←★Upload.phpからのレスポンスはこの形で受ける(公式ドキュメント書いといてくれよ)


                //console.log('response='+JSON.stringify(response));

                //chunksuploadedの最後に必ず必要
                done();
           },
   init: function() {

     途中略

           },

           this.on("success", function(file, data){

               //ここは、chunksUploadedのdone()が実行された後に呼ばれる

               //アップロード完了後の処理を書く

            }

}

 ※parallelChunkUploads: true にすると、分割されたファイルが全部揃う前にファイルが結合されてしまうバグが、pionl/laravel-chunk-uploadにあるのでtrueは駄目

 

以上で完了。

Dropzoneにより、大容量のファイルがChunkSizeで分割されてアップロードされる。

全ての分割がアップロードされると、pionl/laravel-chunk-uploadで1つにまとめられ、デフォルトでは、storage/app/uploadの下に保存される。

そして、Dropzoneにレスポンスが返り、success()が実行される。

 

以上