Question

我试图在Cordova项目上从URI加载图片。

以下代码在Windows Phone上运行正常，但在Android上我无法加载图片。

$(document).ready(function(){
    $("#btnTest").on("click", loadImage);
    $("#btnTestUsingDataUrl").on("click", loadImageFromDataURL);
});

function loadImage(){
    navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50, destinationType: Camera.DestinationType.FILE_URI, sourceType: 0 });
}

function loadImageFromDataURL() {
    navigator.camera.getPicture(onPhotoDataSuccessUsingDataURL, onFail, { quality: 50, destinationType: Camera.DestinationType.DATA_URL, sourceType: 0 });
}

function onPhotoDataSuccess(imageURI) { 
    var imgProfile = document.getElementById('imgTest');
    imgProfile.src = imageURI;
    alert(imageURI);
}

function onPhotoDataSuccessUsingDataURL(imageURI) { 
    var imgProfile = document.getElementById('imgTest');
    imgProfile.src = "data:image/jpeg;base64," + imageURI;
}

function onFail(message) {
    alert('Failed because: ' + message);
}

Android上返回的URI是＆＃34; content：//com.android.providers.media.documents/document/image%3A3449" ;

Android版：5.0.2。

Cordova版本：5.1.1。

相机插件：org.apache.cordova.camera。

使用DataUrl的示例在Android和Windows Phone上均可正常使用。

有人可以帮助我吗？

Answer 1

我找到了答案。我正在使用 Camera.DestinationType.FILE_URI 来获取图片的路径并将其存储以便稍后获取图片。

之后，我使用 FileReader 获取Base64格式的图片，然后附加 img标记。

$(document).ready(function () {
    $("#btnTest").on("click", loadImage);
});

function loadImage() {
    navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50, destinationType: Camera.DestinationType.FILE_URI, sourceType: 0 });
}

function onPhotoDataSuccess(imageURI) {
    window.resolveLocalFileSystemURL(imageURI, resolveOnSuccess, resOnError);
}

function onFail(message) {
    alert('Failed because: ' + message);
}

function resOnError(error) {
    alert("resOnError - " + error.code);
}

function resolveOnSuccess(entry) {
    entry.file(function (fileInput) {
        var reader = new FileReader();
        reader.onloadend = function (evt) {
            var base64 = evt.target.result;
            var imgBase64 = $('#imgTest');
            imgBase64.attr('src', base64);
        };
        reader.readAsDataURL(fileInput);
    }, function () { alert('fail on trying to read the file.') });
}

我希望它有助于某人。 =）

如何使用Cordova从URI加载Android上的图像

1 个答案: