2014-05-03 124 views
1

我知道有很多關於這個問題,但目前我正試圖保存畫布圖像到服務器,我最近啓動JavaScript,所以我遇到了很多問題。 我編寫的圖像編輯器允許用戶在編輯完成後將畫布作爲圖像文件保存到服務器。 ,但由於圖像與動態src在畫布中產生我不能保存與PHP。 任何人都可以幫我解決這個問題嗎?我怎樣才能保存畫布圖像到服務器

我的代碼

html2canvas([document.getElementById('dadycool')], { 
    onrendered: function (canvas) { 
       var data = canvas.toDataURL('image/png'); 
       var image = new Image(); 
       image.src ='data:image/jpeg;base64,""'; 
       document.getElementById('imagec').appendChild(image); 
      $.ajax({ 
     type: "POST", 
     url: "resize.php", 
     data: { 
     imgBase64: dataURL 
     } 
     }).done(function(o) { 
     console.log('saved'); 

     }); 
     } 

我的PHP代碼

echo '<div class="wifix">'; 
    echo '<div class="dadycool" id="dadycool">'; 
    echo '<div class="fixx" align="center"><img class="ui-widget-content" id="resizable" src="uploads/'.$ThumbPrefix.$NewImageName.'" alt="Thumbnail">'; 
    echo '</div>'; 
    echo '</div>'; 
    echo '</div>'; 
    echo '<div id="imagec"></div>'; 

回答

0

哎@mimi也許它更好的,你上傳的圖片作爲字符串的基本64形成,並轉換成PNG服務器 - 上側。 但仍然可以從客戶端上傳圖像,但我更喜歡上傳base-64格式的圖像。

+0

我無法理解你說得很好。你的意思是,我首先上傳爲base64,然後將其轉換爲PNG?但怎麼???! – mkafiyan

+0

@mimi是將字符串(畫布的base64)上傳到服務器端 –

+0

@mimi看看這個[問題](http://stackoverflow.com/questions/13198131/how-to-save-a-html5-畫布作爲圖像在服務器上)它與您的問題類似 –

相關問題