Request Entity Too Large when data sent using AJAX

Question

I am using the JavaScript canvas API toDataURL() to convert an image file to a base64 string and then transferring the string to my server via an XMLHttpRequest or simply an AJAX request. When I upload medium size files(500KB-1MB) I am getting the following error-

413 Request Entity Too Large

I have researched a lot. Tried changing post_max_size , upload_max_size but that didn't help. In an article it was suggested to set limit of the RequestBodyLength in Apache. But I couldn't find a way to do that!

Then I made a small hack and tried to upload the file by the old school method(iframe form upload) and it worked! Any help or suggestion on how to upload using the AJAX base64 string method would be awesome.

EDIT- Here's the JavaScript codes that first converts the canvas element to base64 string and then uploads it to the server using AJAX.

lab.newPost.submit = function(){
var url = 'upload.php';
var params = {
    'title': lab.newPost.elements.photo_form.title.val(),
    'imageData': Meme.canvas[0].toDataURL("image/jpeg"),  //Convert to Base64 data URL
    };

$.post(url,params, function(data){  //AJAX POST
    data = JSON.parse(data);
    if(data.success){
        Msg.success('<a href="#" class="alert-link">Awesome! </a> Thanks for contributing :)');
    }

    else{
      Msg.danger('<a href="#" class="alert-link">Error! </a>'+data.error[0]);
      }
    }).fail(function(xhr, ajaxOptions, thrownError) { //any errors?
    console.log(thrownError);  //This line give 
    });
}

The call returns the following lines-

Request Entity Too Large

The requested resource
/upload.php
does not allow request data with POST requests, or the amount of data provided inthe request exceeds the capacity limit.

Answer 1

A 413 Request Entity Too Large is normally generated when the client sends a POST request that is larger than what the server is capable of handling. This can be dependent on physical resources, or settings at different levels.

Apache configuration

The limit in Apache is set via the LimitRequestBody directive and defaults to 0:

This directive specifies the number of bytes from 0 (meaning unlimited) to 2147483647 (2GB) that are allowed in a request body.

Take a look at the full description of Apache'sLimitRequestBody directive.

PHP Configuration

In PHP, different limits are taking into account: post_max_size , upload_max_filesize (if it is a file upload) and memory_limit . upload_max_filesize has to be lower than post_max_size , which has to be lower than memory_limit .

Suhosin

If PHP is running on Suhosin's protection, more configuration details can cause a server to reject a POST due to its size:

;suhosin.post.max_array_depth = 100
;suhosin.post.max_array_index_length = 64
;suhosin.post.max_name_length = 64
;suhosin.post.max_totalname_length = 256
;suhosin.post.max_value_length = 1000000
;suhosin.post.max_vars = 1000

Note that max_value_length here is exactly in the middle between the uploaded file size and the base64 version. So this might be the problem. Note that in configuration, the same lines appear for suhosin.get and suhosin.request. suhosin.request values should be equal or higher than get and post.