Загрузка изображения из приложения PhoneGap Cordova

Попытка загрузить фотографию, но не может получить данные на сервере. Приложение выводит камеру и выполняет POST на сервер, но никогда не загружается ни один файл.

Я создал простейшее приложение, которое смог проверить на https://github.com/dustinb/Camera/blob/master/index.html. Когда загрузка происходит, на сервер отправляется только 452 байт.

73.3.252.133 - - [04/Dec/2014:23:55:11 +0000] "POST /upload HTTP/1.1" 200 452 "-" "Dalvik/1.4.0 (Linux; U; Android 2.3.4; ADR6400L Build/GRJ22)"

Я просмотрел многочисленные примеры этого и не вижу ничего другого, кроме того, что у меня есть. Я использую build.phonegap.com для сборки и установки

Изменить: использование tcpdump Я вижу, что данные получают на сервере только ничего в переменных $_POST или $_FILES в PHP

0x0030: 150c 34c5 504f 5354 202f 7570 6c6f 6164 ..4.POST./upload
 0x0040: 2048 5454 502f 312e 310d 0a43 6f6e 7465 .HTTP/1.1..Conte
 0x0050: 6e74 2d54 7970 653a 206d 756c 7469 7061 nt-Type:.multipa
 0x0060: 7274 2f66 6f72 6d2d 6461 7461 3b20 626f rt/form-data;.bo
 0x0070: 756e 6461 7279 3d2b 2b2b 2b2b 0d0a 5573 undary=+++++..Us
 0x0080: 6572 2d41 6765 6e74 3a20 4461 6c76 696b er-Agent:.Dalvik
 0x0090: 2f31 2e34 2e30 2028 4c69 6e75 783b 2055 /1.4.0.(Linux;.U
 0x00a0: 3b20 416e 6472 6f69 6420 322e 332e 343b ;.Android.2.3.4;
 0x00b0: 2041 4452 3634 3030 4c20 4275 696c 642f .ADR6400L.Build/
 0x00c0: 4752 4a32 3229 0d0a 486f 7374 3a20 7371 GRJ22)..Host:.sq
 0x00d0: 7561 7265 732e 726f 756e 6470 6f72 6368 uares.roundporch
 0x00e0: 2*** 6f6d 0d0a 436f 6*** 6563 7469 6f6e .com..Connection
 0x00f0: 3a20 4b65 6570 2d41 6c69 7665 0d0a 4163 :.Keep-Alive..Ac
 0x0100: 6365 7074 2d45 6*** 6f64 696e 673a 2067 cept-Encoding:.g
 0x0110: 7a69 700d 0a43 6f6e 7465 6e74 2d4c 656e zip..Content-Len
 0x0120: 6774 683a 2032 3933 3530 0d0a 0d0a gth:.29350....
 -- next packet --
 0x0000: 4500 05dc 617d 4000 3206 a8e9 4903 fc85 E...a}@.2...I...
 0x0010: 68cf 8a5d d68c 0050 aa2b ce30 13d2 95d7 h..]...P.+.0....
 0x0020: 8010 02da 80ec 0000 0101 080a **** ac57 ...............W
 0x0030: 150c 34c5 ffd8 ffe1 0116 4578 6966 0000 ..4.......Exif..
 0x0040: 4949 2a00 0800 0000 0e00 3201 0200 1400 II*.......2.....

Кажется, проблема заключается в том, что граница mime с Content-Disposition и другие заголовки не отправляются. Можно увидеть в дампе после отправки Content-Length, данные JPEG сразу отправляются без использования границы mime.

4 ответа

Проблема заключалась в неправильном подключении File Transfer. Не знаю, где я нашел другой плагин или почему он был использован, но не работает.

- <gap:plugin name="com.chanthu.evri.gcs-file-transfer" version="1.0.0">
+ </gap:plugin>


Попробуйте закодировать URL-адрес перед отправкой.

ft.upload(imageURI, 
 encodeURI(serverURL + "/upload.php"),
function (e) {
 alert('success');
},function (e) {
 alert("failed");
},options);


Попробуйте установить границу, добавляя заголовки к FileUploadOptions

var headers={'Content-Type':'multipart/form-data; boundary=+++++'};
options.headers = headers;


Взгляните на мой пример здесь, я надеюсь, что это поможет.

HTML

<!--– WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 –-->



<title>Camera Cordova Plugin</title>
<button onclick="capturePhoto();">Capture Photo</button>
<button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo
Library</button>

<button onclick="upload();">Upload</button>

JS

function upload() {
 var img = document.getElementById('image');
 var imageURI = img.src;
 var options = new FileUploadOptions();
 options.fileKey = "file";
 options.fileName = imageURI.substr(imageURI.lastIndexOf('/') + 1);
 options.mimeType = "image/jpeg";
 var params = new Object();
 options.params = params;
 options.chunkedMode = false;
 var ft = new FileTransfer();
 ft.upload(imageURI, "https://www.example.com/upload.php", win, fail,
 options);
}
function win(r) {
 console.log("Code = " + r.responseCode);
 console.log("Response = " + r.response);
 console.log("Sent = " + r.bytesSent);
}
function fail(error) {
 alert("An error has occurred: Code = " + error.code);
 console.log("upload error source " + error.source);
 console.log("upload error target " + error.target);
}

PHP

<p> <a href="http://blog.revivalx.com/2014/07/12/upload-image-using-file-transfer-cordova-plugin-for-ios-and-android/" rel="nofollow noreferrer" target="_blank">http://blog.revivalx.com/2014/07/12/upload-image-using-file-transfer-cordova-plugin-for-ios-and-android/</a></p>

licensed under cc by-sa 3.0 with attribution.