2012-03-05 231 views
0

我試圖將從HTML5畫布製作的dataURL保存到我的mysql數據庫。通過AJAX傳遞dataURL

我有阿賈克斯的設置來拉我做了所謂的「dataURL」,我使用此代碼設置dataURL到畫布的IMG了var:

dataURL = oCanvas.toDataURL(); 

我的問題是畫布的dataURL有很多的字符在拉動ajax方面效果不好,所以我需要一種編碼方式或以不同的方式操作,因此我的最終結果可以保存到mysql數據庫中,然後再「解碼」以再次顯示。

我知道我的AJAX作品,因爲如果我將var dataURL設置爲「奶酪」之類的東西,它會以奶酪形式保存在數據庫中。

任何幫助將不勝感激!

回答

0

其實我結束了設置的事件,因此當圖像完成繪製時,會將dataURL設置爲隱藏的表單元素。不再需要通過ajax傳遞它:)。 (還是)感謝你的建議。

2

你toDataUrl接收到的數據將是這樣的格式:

data:image/png;base64,/9j/4AAQSkZJRgABAQAAAQABAAD.... (very long string) 

首先篩選數據接收後,才data:image/png;base64,

的一部分,那麼使用任何Base64編碼庫中的語言提供給解碼它到一個字節數組(或blob)。如果您使用的是Java:Apache Commons Codec

下面是使用Groovy一個例子:

def bytes = new Base64().decode(filteredData) as byte[] 

您可以將解碼後的結果保存到數據庫(稍後檢索)

0

Base64編碼需要幾乎4倍的字節來編碼圖像。建議在傳輸之前使用window.atob來解碼base64,無論您是使用ajax還是常規形式。當然IE不支持它,但是this looks like a shim