[英]Convert image to base64 with the angular library
我在使用angularjs的base64庫將圖像轉換為base64時遇到問題。
看我的功能:
var img = new Image();
img.src = conf.storeUrl + '/' +$scope.fRoot.name + $scope.getFileWay() + value.name;
var base64Img = base64.encode(img);
圖片的網址很好,圖片已經創建,但是base64Img為空...我不明白為什么。...有人有想法嗎?
預先感謝
嘗試這個:
/**
* Convert image
* to a base64 data uri
* @param {String} url
* @param {Function} callback
* @param {String} [outputFormat=image/png]
*/
function convertImageToDataURI(url, callback, outputFormat) {
var img = new Image();
img.crossOrigin = 'Anonymous';
img.onload = function(){
var canvas = document.createElement('CANVAS'),
ctx = canvas.getContext('2d'), dataURL;
canvas.height = this.height;
canvas.width = this.width;
ctx.drawImage(this, 0, 0);
dataURL = canvas.toDataURL(outputFormat);
callback(dataURL);
canvas = null;
};
img.src = url;
}
用法
convertImageToDataURI('ImageLink', function(base64Decoded){
// Base64DataURI
});
支持的輸入格式
image/png, image/jpeg, image/jpg, image/gif, image/bmp, image/tiff, image/x-icon, image/svg+xml, image/webp, image/xxx
Supported output formats
image/png,image/jpeg,image/webp (chrome)
演示:
測試:toDataUrl MIME類型
http://kangax.github.io/jstests/toDataUrl_mime_type_test/
瀏覽器支持(到目前為止,我知道)
IE10(IE10只能使用相同的原始圖像)
來自本地文件系統的圖像
如果要從用戶文件系統轉換圖像,則需要采用其他方法。 使用FileReader API (請參閱此小提琴 )。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.