Phonegap編碼圖像base64

我試圖將圖像編碼爲base64並將其發送到服務器。當我檢索到的圖像全部顯示爲空白。Phonegap編碼圖像base64

我使用的編碼它的代碼是這樣的：

encodeImageUri = function(imageUri) { 
     var c = document.createElement('canvas'); 
     var ctx = c.getContext("2d"); 
     var img = new Image(); 
     img.onload = function() { 
      c.width = this.width; 
      c.height = this.height; 
      ctx.drawImage(img, 0, 0); 
     }; 
     img.src = imageUri; 
     var dataURL = c.toDataURL("image/jpeg"); 

     return dataURL.slice(22, dataURL.length); 
    }

來自Using PhoneGap, How to get base64 image data of the photo chosen from photo library in iPhone

來源

2013-01-11 danielrvt-sgb

圖像加載異步，也就是說你的return dataURL...發生前的圖像進行加載到畫布中。

而不是讓這個函數返回一個值，讓它調用一個回調函數。

encodeImageUri = function(imageUri, callback) { 
    var c = document.createElement('canvas'); 
    var ctx = c.getContext("2d"); 
    var img = new Image(); 
    img.onload = function() { 
     c.width = this.width; 
     c.height = this.height; 
     ctx.drawImage(img, 0, 0); 

     if(typeof callback === 'function'){ 
      var dataURL = c.toDataURL("image/jpeg"); 
      callback(dataURL.slice(22, dataURL.length)); 
     } 
    }; 
    img.src = imageUri; 
}

現在這樣稱呼它：

encodeImageUri('/path/to/image.png', function(base64){ 
    // Do something with the b64'd image 
});

注：對於此工作，圖像必須在同一個域作爲你的頁面。

來源

2013-01-11 20:30:42

它仍然不起作用，我得到了一串A的字符串 –

@ danielrvt-sgb：圖像是否與您的頁面在同一個域上？你確定這個字符串是錯的嗎？ –

圖像與手機相機拍攝並存儲在SD卡中。我測試了這個頁面中的字符串：http://www.freeformatter.com/base64-encoder.html並返回一個空白圖像 –

使用readAsDataURL方法FileReader。

來源

2013-01-11 21:38:44

如果沒有關於創建FileEntry對象實例的文檔，如何使用readAsDataUrl？ –

帶你imageURI並將其傳遞給window.resloveLocalFileSystemURI，它將FileEntry對象作爲成功回調的參數。然後你就可以使用FileReader來讀取FileEntry。 –

我得到resloveLocalFileSystemURI未定義 –

我使用下面的代碼將圖像轉換爲Base64：

var Base64 = { 
    /** 
    * This implementation relies on Cordova 1.5 or above implementations. 
    */ 
    getBase64ImageFromInput : function (input, callback) { 
     var imageReader = new FileReader(); 
     imageReader.onloadend = function (evt) { 
      if (callback) 
       callback(evt.target.result); 
     }; 
     //Start the asynchronous data read. 
     imageReader.readAsDataURL(input); 
    }, 
    formatImageSrcString : function (base64) { 
     return (base64.match(/(base64)/))? base64 : "data:image/jpeg;base64," + base64; 
    } 
};

下面是使用該對象的圖像從文件輸入轉換爲base64編碼的例子：

var fileInput = document.createElement('input'); 
fileInput.type = 'file'; 
fileInput.onchange = function() { 
    var input = this.files[0]; 
    if (input) { 
     Base64.getBase64ImageFromInput(input, function (imageData) { 
      //Process the image string. 
      console.log(imageData); 
     }); 
    } else { 
     alert("Please select an image."); 
    } 
};

希望這有助於。如果您有任何問題，請告訴我。

來源

2013-01-11 22:42:11 Zorayr

Phonegap編碼圖像base64

回答

相關問題