Question

我正在使用图片选择器（cordova-imagePicker）插件，以便从图库中获取图片并将其上传到服务器。

我正在使用带有Android平台5.1.1的Cordova 6.1.1和以下插件：

private string mMyProperty;
public string MyProperty
{
    get { return mMyProperty; }
    set
    {
        mMyProperty = value;
        PerformSomeAction();
    }
}

作为对插件的回调，我使用以下代码将我获得的路径转换为文件。请注意，我使用cordova-plugin-camera 2.2.0 "Camera" cordova-plugin-compat 1.0.0 "Compat" cordova-plugin-device 1.0.1 "Device" cordova-plugin-file 4.2.0 "File" cordova-plugin-imagepicker 1.1.0 "ImagePicker" cordova-plugin-inappbrowser 1.4.0 "InAppBrowser" cordova-plugin-media 2.3.0 "Media"，因为此代码也在桌面上运行，在这种情况下，该条目已经是一个File对象。

resolveFile

这又用于读取图像并将其传递给将其上传到服务器的函数（var resolveFile = function(entry) { if (typeof(entry) === "string") { var deferred = $q.defer(); // first convert to local file system URL window.resolveLocalFileSystemURL(entry, function(fileEntry) { // now read/convert the file to file object. fileEntry.file(function(file) { console.log("File converted to file entry"); deferred.resolve(file); }, function(err) { console.log("Failed to convert to file entry", err); deferred.reject(err); }); }, function(err) { console.log("Failed to resolve to file URL", err); deferred.reject(err); }); return deferred.promise; } else { return $q.when(entry); } };是我从插件获取的，或者是桌面/浏览器中的输入）：< / p>

$files

在上面，onload会剪切图像数据（在字符串中的'base64，'之后）并将其发送到需要base64字符串的上传代码，并使用简单的AJAX调用将数据上传到服务器：

var upload = function () {
    if (!$files[currentFile]) {
        onAllFinished();
        return;
    }
    file = $files[currentFile];
    beforeLoad(file);
    fileReader = new FileReader();
    fileReader.onload = onload;
    fileReader.onprogress = progress;
    resolveFile(file).then(function(actualFile) {
        fileReader.readAsDataURL(actualFile);
    });
    currentFile++;
};

最后一个函数也适用于使用var uploadPhoto = function(url, photo, callback, error) $http.post(url, { photo: photo, }) .success(callback) .error(function (data, status, headers, config) { if (error) error(data, status, headers, config); });目标的相机插件camera plugin（我知道，不推荐），它也会返回一个base64字符串（所以我可以重用代码）。

在我看来文件阅读器输出有问题（我猜）。（我认为）提示的是，小图像（10s kb）被正确加载以及已经从相机插件准备好的base64字符串，但更大的图像（几MB）通过文件阅读器（在Android上，在桌面上它很好））上传已损坏（见下文）。

有没有人遇到过这样的问题？任何人都可以建议修复（除了更改代码以使用FileTransfer插件）？

原始图片：

上传（损坏）的图片。注意，其中一些是正常阅读/上传的：

Answer 1

我在寻找类似问题的解决方案时找到了您的问题。当使用fileReader.readAsDataURL时，DataURL的相机大图像会在用作图像源时出现，但同一图像被破坏。

我已经能够通过使用fileReader.readAsBinaryData而不是fileReader.readAsDataURL来绕过这个问题，然后将binarystring转换为dataURL。

window.resolveLocalFileSystemURL(imageUri, function done(fileEntry) {
    fileEntry.file(function (fileObj) {
        var image = new Image();
        var reader = new FileReader();
        reader.onloadend = function (e) {
            image.src = "data:image/jpeg;base64," + window.btoa(e.target.result)
        }
        reader.readAsBinaryString(fileObj);
    }
}

希望这有助于您找到自己的解决方法。

Cordova - 阅读大图像会破坏图像

1 个答案: