PhoneGap/Cordova从照片库获取图片，文件传输不起作用

Question

我在结合Cordova的camera.getPicture插件和FileTransfer.upload插件时遇到了一些问题。最奇怪的是，当我从相机拍照时一切正常，但当我从图库中检索照片时就不行了。

问题看起来像这个链接中的问题: Phonegap/Cordova Uploading Image from gallery is not working on Android Kitkat，但我正在使用Cordova 3，因此必须修复Kitkat的问题。

我的代码:

var imageUploadUrl = setting_api_url + "Umbraco/Api/ImageApi/PostUpload";
var formSubmitUrl = setting_api_url + "Umbraco/Api/FormApi/PostSend";
var imageUriStorage = [];
var resultsCollection = [];
var FieldId;

var take_photo = function(fieldId) {
FieldId = fieldId;
navigator.camera.getPicture(onTakeSuccess, 
                            onTakeFail, 
                            { 
    quality: 30, 
    destinationType: Camera.DestinationType.FILE_URI, 
    sourceType: Camera.PictureSourceType.CAMERA,
    targetWidth: 800,
    targetHeight: 800,
    correctOrientation: true
});
};

var get_photo = function(fieldId) {
FieldId = fieldId;
navigator.camera.getPicture(onTakeSuccess, onTakeFail, { 
    quality: 30, 
    destinationType: Camera.DestinationType.FILE_URI, 
    sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
    targetWidth: 800,
    targetHeight: 800,
    correctOrientation: true });
};

var onTakeSuccess = function(imageURI) {
console.log("onTakeSuccess imageURI= " + imageURI);

var image = document.getElementById("preview-" + FieldId);

// UPLOAD PART COPIED
var options = new FileUploadOptions();
options.fileKey = "file";
options.fileName = src.substr(src.lastIndexOf('/') + 1);
var filetype = src.substr(src.lastIndexOf('.') + 1);
if(filetype == "png") {
    options.mimeType = "image/png";
}
else if (filetype == "jpg") {
    options.mimeType = "image/jpeg";
}

var ft = new FileTransfer();
ft.upload(imageURI, encodeURI(imageUploadUrl), image_upload_win, image_upload_fail, options);
// END.


imageUriStorage.push({ 'Id':FieldId, 'Path': imageURI});

image.src = imageURI;
};

var onTakeFail = function(message) {
alert('on take fail. Code: ' + message);
};

// called when upload succeeds        
var image_upload_win = function (r) {
    console.log("Code = " + r.responseCode);
    console.log("Response = " + r.response);
    console.log("Sent = " + r.bytesSent);
};

// when upload fails
var image_upload_fail = function (error) {
    alert("Code = " + error.code + "-" + error.http_status + ", image:" + error.source);
    console.log("upload error source " + error.source);
    console.log("upload error target " + error.target);
};

无论是take_photo还是get_photo都会命中onTakeSuccess函数，因此它们将获得相同的处理过程。当源是相机时，图像可以正确上传，服务器会给出正确的响应（和HTTP 201）。

但是，当源是库时，这将失败。FileTransfer.Upload会给出错误代码1（文件未找到），但这不可能是真的，因为该图像在我的应用程序的图像元素中正确显示。

服务器返回HTTP 400坏请求。

在处理过程中有一个区别，即图像URL的格式，但这会产生什么样的差异呢？

记录成功的getPicture（相机）：

onTakeSuccess imageURI=file:///mnt/sdcard/Android/data/com.XXX.YYY/cache/1404910577158.jpg
Code = 201
Response = "8999"
Sent = 195

记录未成功获取图片（库）：

onTakeSuccess imageURI= file:///mnt/sdcard/Android/data/com.XXX.YYY/cache/modified.jpg?1404910903858
upload error source file:///mnt/sdcard/Android/data/com.XXX.YYY/cache/modified.jpg?1404910903858
upload error target https://CORRECTURL/Umbraco/Api/ImageApi/PostUpload

此外，getPicture（LIBRARY）的情况会出现以下警告：
Code = 1-400，image：file:///mnt/sdcard/Android/data/com.XXX.YYY/cache/modified.jpg?1404910903858

- Thom Hubers

---

你有解决这个问题的办法吗？我遇到了同样的问题，我的图库路径与图像URI不同。 - fsi

还没有找到。 - Thom Hubers

也许这个答案会有用 https://dev59.com/uYPba4cB1Zd3GeqPyund - fsi

如果您现在正在寻找此内容，值得注意的是，在cordova-plugin-camera的最新版本中已经修复了此问题。如果您仍然遇到此问题，请确保更新您的插件。 - KyleT

Answer 1

使用cordova 6.0.0，cordova-plugin-camera 2.1.0，cordova-plugin-whitelist 1.2.1。

我遇到了类似的问题（尽管可能是因为不同的原因，因为这是一个更新版本）。

我发现我需要在config.xml中加入以下行。

<access origin="*" />
<access origin="content:///*" />

注意：只有

。

<access origin="*" />

不够

- Elia Weiss

Answer 2

我的当前解决方法是从imageUri中删除"?"和其后面的所有内容。这样URI始终看起来像：

file:///mnt/sdcard/Android/data/com.XXX.YYY/cache/modified.jpg

在我的情况下，这个操作可以正常工作并正确传输文件。

- Kiki

---

如果我删除问号后面并传递modified.jpg，它仍然无法工作。 - sasi

Answer 3

是的！来自图库的一些文件是这种格式：modified.jpg?1438896451328。

为了防止这种情况，我在我的upload.php文件中加入了一些代码：

        $temporary = explode(".", $_FILES["file"]["name"]);
        $file_extension = end($temporary);

   // cortamos caracteres extraños por si llega algun nombre de archivo raro
        $cadena = $file_extension; 
        $patron = "?"; 
   // localicamos en que posición se haya "?"
        $posicion = strpos ($cadena, $patron); 
   // eliminamos los caracteres desde ? hacia la derecha
        if ($posicion !== false){
        $file_extension = substr ($cadena, 0, $posicion); 
        }

然后您可以对文件类型、大小等进行筛选操作，最后保存。

- Javier dc