将映像编码到base64并上传到Phonegap中的Web服务

时间:2013-11-29 08:00:23

标签: javascript android web-services cordova

在我的PhoneGap项目中,我使用 navigator.device.capture.captureImage(captureSuccess,captureError,{limit:1}); 来拍照。在captureSucces函数中,我得到了de MediaFile,我将其编码为base64:

var file="";
var datafile=mediaFiles[0];

var reader = new FileReader();
reader.onload = function(evt){
  file=evt.target.result;
};
reader.readAsDataURL(datafile);

我将此文件发送到REST Web服务,在那里我解码文件并保存在一个文件夹中:

if (files != null) {
            FileOutputStream fileOutputStream = null;
            try {
                byte[] byteFichero = Base64.decodeBase64(files);
                System.out.println("ARCHIVO " + byteFichero);
                File fich = new File(pathFichero.toString());
                fich.createNewFile();

                fileOutputStream = new FileOutputStream(fich);
                fileOutputStream.write(byteFichero);

                System.out.println("Fichero almacenado ok");
            } catch (Exception e) {
                System.out.println("Excepcion alamacenando fichero "
                        + e.getMessage() + " " + pathFichero);
                return respuesta;
            } finally {
                try {
                    if (fileOutputStream != null) {
                        fileOutputStream.close();
                    }
                } catch (IOException ex) {
                    Logger.getLogger(
                            GestionFicheroObjetoService.class.getName())
                            .log(Level.SEVERE, null, ex);
                }

                pathFichero.delete(0, pathFichero.length());
            }
}

不幸的是,我得到一张空图像(1 KB)。这是因为文件值不正确,它包含:

{"name":"1385711756945.jpg",
"fullPath":"file:///storage/sdcard0/DCIM/Camera/1385711756945.jpg",
"type":"image/jpeg",
"lastModifiedDate":1385711757000,
"size":2785413,
"start":0,
"end":0}

当我编码时,我得到一些base64代码:

[B@877d81

在其他示例中,他们总是使用输入类型文件来获取文件(http://thiscouldbebetter.wordpress.com/2013/07/03/converting-a-file-to-a-base64-dataurl-in-javascript/),但我必须从相机中获取文件。

有什么问题?其他一些解决方案?

非常感谢。

2 个答案:

答案 0 :(得分:1)

我也面临这个问题。经过长时间的搜索,我得到了解决方案

相机成功功能:

function capturesuceess(mediafiles){

var uploadimageurl= mediafile
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFileSystemSuccess, rfail);


 window.resolveLocalFileSystemURI(uploadimageurl, onResolveSuccess, fail);
}
function onFileSystemSuccess(fileSystem) {
    console.log(fileSystem.name);
}
function bytesToSize(bytes) {
    var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
    if (bytes == 0) return 'n/a';
    var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
    return Math.round(bytes / Math.pow(1024, i), 2) + ' ' + sizes[i];
};
function onResolveSuccess(fileEntry) {


    filenameofajax=fileEntry.name;

    var efail = function(evt) {
        console.log("File entry error  "+error.code);
    };
    var win=function(file) {
        console.log(file);
        alert(bytesToSize(file.size));
        var reader = new FileReader();
        reader.onloadend = function(evt) {
            console.log("read success");
              console.log(evt.target.result);
            var basestr=evt.target.result;

            basestr= basestr.substr(basestr.indexOf("base64,")+7,basestr.length);
         console.log(basestr);// this is a base64 string


        };
        reader.readAsDataURL(file);
    };
    fileEntry.file(win, efail);
}

试试这个工作正常。你也可以用空白享受phonegap写 efail 失败功能

答案 1 :(得分:0)

执行此操作的最佳方法是使用navigation.camera:

https://gist.github.com/pamelafox/2173589