如何保存從畫布轉換為本地文件夾的圖像？

Question

對於我的javascript應用程序，我需要對ipad演示文稿中的每個頁面進行截屏，無論如何，我都使用html2canvas找到了解決方案。 現在，我可以將html頁面轉換為圖像，但是如何使用javascript將其保存在演示文稿圖像文件夾中？

這是我的javascript

html2canvas(document.body, 
{
  onrendered: function(canvas) 
{  
  var test = document.getElementsByClassName('test');    //finding the div.test in the page  
  $(test).append(canvas);                                //appending the canvas to the div
  var canvas = document.getElementsByTagName('canvas');     
  $(canvas).attr('id','test');                          //assigning an id to the canvas
  var can2 = document.getElementById("test");
  var dataURL = can2.toDataURL("image/png");            //converting the canvas to      image(PNG)      
  document.getElementById("image_test").src = dataURL;  //assigning the url to the image
  $(canvas).remove();                                   //removing the image
},logging:true,background: "#fff",
});

這是我的html

<div class="wrapper">
  <div class="container">
    <div class="test">
      <img src="" id="image_test">
    </div>
  </div>
</div>

有人可以幫我如何在演示文稿圖像文件夾中保存ID為“ image_test”的圖像嗎？

提前致謝。

Answer 1

如果要將文件保存在服務器上，則可以將用戶鏈接到文件頁面。 否則，您可以根據數據鏈接到“假”路徑

例如：

function download(data){
    document.location = 'data:Application-octet-stream,'+
                         encodeURIComponent(data);
}

http://blogs.adobe.com/cantrell/archives/2012/01/how-to-download-data-as-a-file-from-javascript.html