Question

I have my canvas represented as a base64 string. I would like to pass this string to the server so that the server may craft a PDF document using the data.

I receive a 414 error when I attempt to pass the data to the server: ‘Failed to load resource: the server responded with a status of 414 (Request-URI Too Long).

I have successfully downloaded the image client-side. I have no problems actually retrieving and downloading the image, only in shaping the file type it is represented in.

$('#ExportPlanView').click(function (e) {
    //planViewStage.toDataURL(function (e) { window.location = e.replace("image/png", "image/octet-stream")});
    planViewStage.toDataURL(function (dataURL) {
        var output = dataURL.replace(/^data:image\/(png|jpg);base64,/, "");

        $.ajax({
            url: '../PlanView/ExportAsPDF',
            data: { DataURL: output },
            datatype: 'json',
            success: function (stream) { window.location = stream; }
        });
    });
});

Is the proper solution to break output into smaller chunks and send each chunk to the server, have the server reconstruct these chunks, craft the pdf, then send that file stream back to the client to trigger the download?

For reference — the data URL is ~105k characters.

Answer 1

Use a POST request when you need to pass large amounts of data. $.ajax defaults to GET, so you need to define the type manually.

To send a POST request with jQuery, you can use something like this:

$.ajax({
    url: 'blah.php',
    type: 'POST',
    data: { DataURL: output },
    datatype: 'json',
    success: function() { ... }
})