Solution 1 :

When you’re using php and ajax POSt request, you’re basically pass information from the browser to the server… file_put_contents by definition is a server side file saving command

you’re solution must be on the Javascript side, opening a dialog box for the user to save the file. No php or ajax required

After some googling, I’ve found a library to do just that, jQuery required

Problem :

When I will click the capture button the data will be saved in my server in upload folder instead of that I want my data to be saved in my Desktop. So that client will take a screenshot of the form and save the data in their PC . But I didn’t find any solution. I am new to this coding language so whatever i got I made a file, This file is working fine but it saves the data in the server folder I want to save in client desktop so that they can save in their PC.

  function doCapture() {
    window.scrollTo(0, 0);
    html2canvas(document.getElementById("about_data")).then(function(canvas) {
      console.log(canvas.toDataURL("image/jpeg", 0.7));
      var ajax = new XMLHttpRequest();"POST", "save-capture.php", true);
      ajax.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
      ajax.send("image=" + canvas.toDataURL("image/jpeg", 0.9));
      ajax.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
    $image=  $_POST["image"];
    $image = explode(",",$image)[1];
    $image= str_replace(" ","+",$image);

enter image description here