title: How to save a PNG image server-side, from a base64 data URI
body: <p>I'm using Nihilogic's "Canvas2Image" JavaScript tool to convert canvas drawings to PNG images. 
  What I need now is to turn those base64 strings that this tool generates, into actual PNG files on the server, using PHP.</p>
  
  <p>In short, what I'm currently doing is to generate a file on the client side using Canvas2Image, then retrieve the base64-encoded data and send it to the server using AJAX:</p>
  
  <pre><code>// Generate the image file
  var image = Canvas2Image.saveAsPNG(canvas, true);   
  
  image.id = "canvasimage";
  canvas.parentNode.replaceChild(image, canvas);
  
  var url = 'hidden.php',
  data = $('#canvasimage').attr('src');
  
  $.ajax({ 
      type: "POST", 
      url: url,
      dataType: 'text',
      data: {
          base64data : data
      }
  });
  </code></pre>
  
  <p>At this point, "hidden.php" receives a data block that looks like <strong><em>data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABE...</em></strong></p>
  
  <p>From this point on, I'm pretty much stumped. From what I've read, I believe that I'm supposed to use PHP's <em>imagecreatefromstring</em> function, but I'm not sure how to actually create an actual PNG image from the base64-encoded string and store it on my server.
  Please aid!</p>