[英]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.