从Base64 Ionic编码和解码图像

时间:2016-05-12 16:19:53

标签: javascript angularjs ionic-framework

我正在创建一个应用程序(离子),将图像作为字符串上传到某个在线服务,我只有设备上的图像的URI,我如何加载图像并将其转换为base64字符串,以及后来查看它在应用程序中?

1 个答案:

答案 0 :(得分:0)

使用FileReader

  

FileReader对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用File或Blob对象指定要读取的文件或数据。

通过创建function

function convertFileToDataURLviaFileReader(url, callback){
    var xhr = new XMLHttpRequest();
    xhr.responseType = 'blob';
    xhr.onload = function() {
        var reader  = new FileReader();
        reader.onloadend = function () {
            callback(reader.result);
        }
        reader.readAsDataURL(xhr.response);
    };
    xhr.open('GET', url);
    xhr.send();
}

然后调用它来获取 base64 数据:

convertFileToDataURLviaFileReader('yourUrlHere',function(base64Data){
    //do something with base64Date

    //show image
    $scope.imageSrc=base64Data;
});

使用标记:

<image ng-src="imageSrc" />