title: html2canvas save image doesn't work
body: <p>I'm rendering a screenshot with html2canvas 0.4.0 and want to save it as image on my webserver.</p>
  
  <p>To do so, I've written the following function:</p>
  
  <h2>JavaScript</h2>
  
  <pre><code>function screenShot(id) {
  
      html2canvas(id, {
          proxy: "https://html2canvas.appspot.com/query",
          onrendered: function(canvas) {
  
              $('body').append(canvas); // This works perfect...
  
              var img = canvas.toDataURL("image/png");
              var output = img.replace(/^data:image\/(png|jpg);base64,/, "");
  
              var Parameters = "image=" + output + "&amp;filedir=" + cur_path;
              $.ajax({
                  type: "POST",
                  url: "inc/saveJPG.php",
                  data: Parameters,
                  success : function(data)
                  {
                      console.log(data);
                  }
              }).done(function() {
              });
  
          }
      });
  }    
  </code></pre>
  
  <h2>saveJPG.php</h2>
  
  <pre><code>&lt;?php
      $image = $_POST['image'];
      $filedir = $_POST['filedir'];
      $name = time();
  
      $decoded = base64_decode($image);
  
      file_put_contents($filedir . "/" . $name . ".png", $decoded, LOCK_EX);
  
  
      echo $name;
  ?&gt;    
  </code></pre>
  
  <p>After the canvas is rendered I can perfectly append it to the HTML body, but saving it on my server result in a corrupted (?) file.</p>
  
  <p>I can read the dimensions in IrvanView, but the image is transparent / empty?
  The file is about 2.076 KB large. So it's not really empty.</p>
  
  <p>I tried this with JPEG as well and it results in a corrupted file and IrfanView says something like "bogus marker length".</p>
  
  <p>The screenshot has the dimensions of 650x9633. Is it to much data for a POST-Method?</p>