如何在瀏覽器中將SVG轉換為圖像（JPEG，PNG等）並保存在服務器上以進行產品預覽以結帳

Question

在使用base64結賬之前，我正在使用html2canvas轉換svg以在服務器端保存為png產品預覽。 svg工作正常。 這是一個定制的項目結帳。 問題是在單擊自定義和結帳后，svg圖像在結賬前不會保存到結帳頁面上預覽。 原因是我不知道要寫什么來保存它的PHP。 我需要幫助編寫“savetoserver.php”的php代碼以保存到服務器

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.';  
 ?>