How to show a custom error message in DropzoneJS?

Question

I need to check if a file has a valid MIME type, if the file size is ok and if its dimensions are ok, then upload file.

So when everything is OK, I can use:

complete: function(file){
    // do something here.
}

but what if the size of file was invalid? In my PHP script I return an error message:

return json_encode(['error' => 'size is invalid']);

OR

return Response::json(['error' => 'size is invalid'], 500 ];
// this is Laravel 4 syntax. returns a json array and 500 as status code.

but how can I handle that error in DropzoneJS?

I tried adding a second parameter to the complete() function but it's not working.

complete: function(file, response){
    console.log( response ); // this does not work.
}

Answer 1

To get the response after the file was submitted to server use this in DropzoneJS:

success: function(file, response) {
  alert(response);
}

And to validate the file before uploading it use this:

complete: function(file) {
  if (file.size > 3.5*1024*1024) {
     alert("File was Larger than 3.5Mb!");
     return false;
  }

  if(!file.type.match('image.*')) {
    alert("Upload Image Only!");
    return false;
  }
}

If your server is returning response in JSON, you'll need to use JSON.parse before alerting it.

Hope it'll help you! Cheers! :)

Answer 2

Set the HTTP response code http_response_code(415); // Unsupported Media Type or http_response_code(415); // Not Acceptable

    function showError($message)
    {
        http_response_code(415);
        die($message);
    }