iOS Safari crashing with large post data form submit

Question

I have a HTML5 Canvas element. I need to submit the canvas image to my server. It works fine in all PC browsers I've tried, but iOS Safari crashes with an Out of Memory error in the log files. The canvas image is almost 500 KB because it is 950x323 PNG. Here's a simplified version of my submit code:

$('#imageJSON').val(JSON.stringify(myCanvas)); //I wrote other JSON stringify code. It works
var d = myCanvas.toDataURL();
$('#imageData').val(d);
$('#myForm').submit();

Safari starts to submit, but crashes several seconds into the submit. The server gets the other data with the request, but the imageData is not complete. I tried changing the form enctype to "multipart/form-data" but that didn't help.

Answer 1

It turns out that there is a memory bug in WebKit for Mac. I submitted the bug to webkit.org https://bugs.webkit.org/show_bug.cgi?id=84168. I found an alternative solution is to send the data via AJAX instead of the standard form submission.

$('#imageJSON').val(JSON.stringify(myCanvas)); 
var d = myCanvas.toDataURL();
$('#imageData').val(d);
var data = $(form).serialize();
$.post(ajaxurl, data, function(r) {
    // done. handle response. remove loading overlay.
});

Worked great, but it was kind of a pain. I use javascript (code not shown) to direct the browser to the appropriate page after form submission and it kinda simulates a standard form submission, but it isn't as smooth to the user.