如何在浏览器中将SVG转换为图像（JPEG，PNG等）并保存在服务器上以进行产品预览以结帐

Question

I'm converting svg using html2canvas to save on server side as png product preview before checkout with base64. The svg works fine. It's for a customized item checkout. The problem is after customization and checkout is clicked, the svg image does not save to preview on checkout page before checking out. Reason is i don't what to write to for the php to save it. I need help in writing the php code for "savetoserver.php" to save to server

function imagetopng(){
      function showCheckout() {
        $("#checkoutcontainer").show();
        $(".productoverview").show();
        $("#popup").show();


      }
      setTimeout(showCheckout, 500);
      html2canvas($(".stole"), {
          allowTaint: true,
          letterRendering: true,
          onrendered: function(canvas) {
          $('.stole-png').prepend(canvas);
            var dataURL = canvas.toDataURL('image/png', 1.0);
            $.ajax({
              type: "POST",
              url: "savetoserver.php",
              data: {
                 imgBase64: dataURL
              }


            })
            .done(function(o) {

                var fileurl = o;
                var websiteurl = "http://woven.indexsta.com/";
                var formatted = websiteurl + fileurl;
                //var formatted = "stole-designs/" + fileurl
                $('#stole-url').attr('value', formatted);
                $('#stolepreview').attr('src', fileurl);

              // If you want the file to be visible in the browser
              // - please modify the callback in javascript. All you
              // need is to return the url to the file, you just saved
              // and than put the image in your browser.
            });
          }
      });
      $('.stole-png').empty();


    };

    $('#closecheckout').on('click touch',function(){
      $("#checkoutcontainer").css('display','none');
      $("#popup").css('display','none');

    });

Answer 1

I figured it out. Incase anyone faces same challenge, here's the script i wrote to solve it. 

<?php  
      // requires php5+ 
       // create directory
      if (!file_exists('images/')) {
        mkdir('images/', 0777, true);
      }
      define('UPLOAD_DIR', 'images/');  
      $img = $_POST['imgBase64'];  
      $img = str_replace('data:image/png;base64,', '', $img);  
      $img = str_replace(' ', '+', $img);  
      $data = base64_decode($img);  
      $file = UPLOAD_DIR . uniqid() . '.png';  
      $success = file_put_contents($file, $data);  
      print $success ? $file : 'Unable to save the file.';  
 ?>