在 visual studio apache cordova 中将图像转换为 base64 字符串

Question

我正在开发 VS2015 cordova 应用程序。当我从图库获取图像并将其转换为 base64string 时遇到问题。我成功地获得了 base64string，但是当我显示它时，我总是得到黑色图像。这是我的代码：

    function onPhotoURISuccess(imageURI) {
     var largeImage = document.getElementById('smallImage');
    largeImage.style.display = 'block';
    largeImage.src = imageURI;
    basestrg = encodeImageUri(imageURI);

}

function getPhoto(source) {
           navigator.camera.getPicture(onPhotoURISuccess, onFail, {
        destinationType: Camera.DestinationType.NATIVE_URI, mediaType: Camera.MediaType.Photo,
        sourceType: source
    });
}
function encodeImageUri(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;
}

任何想法

Answer 1

我试图让你的特定代码工作，但我看到了与黑框相同的最终结果。

不过，我认为有一种更简单的方法可以实现您的目标。您可以使用名为 DATA_URL 的选项，而不是将 NATIVE_URI 作为目标类型传递。此 DATA_URL 选项将为您提供 base64 编码的字符串，您随后可以在图像元素中使用该字符串。

这是一些代码，当我将它放入您的 getPhoto() 函数时对我有用。我改编自 Cordova Camera Plugin Documentation:

navigator.camera.getPicture(onSuccess, onFail, {
    destinationType: Camera.DestinationType.DATA_URL,
    mediaType: Camera.MediaType.PICTURE,
    sourceType: source
});

function onSuccess(imageData) {
    var image: any = document.getElementById('myPicture');
    image.src = "data:image/jpeg;base64," + imageData;
}

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

在 visual studio apache cordova 中将图像转换为 base64 字符串

Convert image into base64string in visualstudio apache cordova

jquery

phonegap-plugins

cordova

visual-studio-cordova