-
- Notifications
You must be signed in to change notification settings - Fork 175
Dropzone
Martin Kluska edited this page Jun 21, 2020 · 7 revisions
Package | View | Javascript | handler class |
---|---|---|---|
Website | Source | Source | DropZoneUploadHandler |
- Read the official docs
- Create the view as package requires
- Implement the basic dropzone code
// A quick way setup var myDropzone = new Dropzone("#my-awesome-dropzone", { // Setup chunking chunking: true, method: "POST", maxFilesize: 400000000, chunkSize: 1000000, // If true, the individual chunks of a file are being uploaded simultaneously. parallelChunkUploads: true }); // Append token to the request - required for web routes myDropzone.on('sending', function (file, xhr, formData) { formData.append("_token", token); })
Dropzone will not use correct chunk response for final response
Change the onload callback for xhr request to catch the correct response.
// Append token to the request - required for web routes myDropzone.on('sending', function (file, xhr, formData) { formData.append("_token", token); // This will track all request so we can get the correct request that returns final response: // We will change the load callback but we need to ensure that we will call original // load callback from dropzone var dropzoneOnLoad = xhr.onload; xhr.onload = function (e) { dropzoneOnLoad(e) // Check for final chunk and get the response var uploadResponse = JSON.parse(xhr.responseText) if (typeof uploadResponse.name === 'string') { $list.append('<li>Uploaded: ' + uploadResponse.path + uploadResponse.name + '</li>') } } })
- Success event response text empty (Dropzone issue) - https://github.com/pionl/laravel-chunk-upload/issues/41