Apache Cordova文件上传

问题

cordova提供了FileEntry和File两个，怎么利用这两个类完成前端的文件上传？

思路

将FileEntry转成File，然后再利用FileReader读取File，从将Cordova的File转化成javascript原生的Blob。最后利用XMLHttpRequest完成异步文件上传。

解决

Javascript

fileEntry.file(function (file) {
    var reader = new FileReader();
    reader.onloadend = function(evt) {
        var blob = new Blob([new Uint8Array(evt.target.result)], { type: "image/png" });
        var formData = new FormData();
        formData.append("file", blob, file.name);
        var request = new XMLHttpRequest();
        request.open('POST', "http://xxx/upload");
        request.onreadystatechange = function() {
            if (request.readyState == XMLHttpRequest.DONE) {
                alert(request.responseText);
            }
        }
        request.send(formData);
    };
    reader.readAsArrayBuffer(file);
});

总结

因为cordova的file不是Blob，所以需要先从Cordova中的File对象中读取数据，然后，转化成原生Blob对象即可。

参考

• Creating a FormData object from scratch
• Read a file
• FileEntry
• MultipartFile