How to upload a screenshot of the page to the server? Good time of day!

I need to make a screen of a part of the page and upload it to the server without reloading the page.

I found the html2canvas.js library. It will solve my question by making the base64 line and passing it to php:

JS: $(document).ready(function () { $('#btnCapture').on("click", function () { captureAndUpload(); }); function captureAndUpload() { $('body').html2canvas({ onrendered: function (canvas) { var i = canvas.toDataURL("image/png"); $.ajax({ url: "http://artultra/save.php?img=" + i , type:"post", async: false, proccessData: false, success: function(response){ alert('ok') }, error:function(xhr, ajaxOptions, thrownError){ alert(xhr.responseText); } }); } }); } }); PHP: $data = $_REQUEST['img']; list($type, $data) = explode(';', $data); list(, $data) = explode(',', $data); $data = base64_decode($data); file_put_contents('image.png', $data);

When sending a picture, a very long url is formed (more than 2000 characters). And error 414 proves this (Request-URI Too Large).

How can I solve this issue without turning off the apache nuts? Is there any alternative?

    1 answer 1

    Why do you send a POST request, and transmit the data as GET parameters?

    To send data as POST you need:

     $.ajax({ url: "http://artultra/save.php", type:"post", data: { img : i }, success: function() {}, error: function() {} });

    They will also be available from the $_POST / $_REQUEST array in your variant only $_GET / $_REQUEST