HTML / JavaScript
Значит задача стоит у нас какая, мы хотим отправить фотографию из галереи на сервер, для этого нам нужно из приложения зайти в галерею выбрать фотографию, взять адрес фотографии и отравить её по указанному адресу (Адрес мы прямо в js коде пропишем).
Открываем Cordova API (PhoneGap API старое название) и находим там FileTransfer object, вот это нам нужно для отправки на сервер данных, можно прямо оттуда скопировать код, и вставить его к себе в проект но тогда у нас сразу при загрузке программы будет вылетать галерея и выбор фотографии, а можно немного подредактировать и сделать что бы галерея открывалась по нажатию кнопки так и сделаем. Код ниже выполняет все что требуется:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>File Transfer Example</title>
<script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
<script type="text/javascript" charset="utf-8">
// Ждем пока загрузится PhoneGap
document.addEventListener("deviceready", onDeviceReady, false);
// PhoneGap готов к работе
function onDeviceReady() {
// Do cool things here...
}
function getImage() {
// Открываем галерею
navigator.camera.getPicture(uploadPhoto, function(message) {
alert('get picture failed');
},{
quality: 50,
destinationType: navigator.camera.DestinationType.FILE_URI,
sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY
}
);
}
//загружаем картинки на сервер
function uploadPhoto(imageURI) {
var options = new FileUploadOptions();
options.fileKey="file";
options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1);
options.mimeType="image/jpeg";
var params = new Object();
params.value1 = "test";
params.value2 = "param";
options.params = params;
options.chunkedMode = false;
var ft = new FileTransfer();
ft.upload(imageURI, "http://yourdomain.com/upload.php", win, fail, options);
}
//если все хорошо
function win® {
console.log("Code = " + r.responseCode);
console.log("Response = " + r.response);
console.log("Sent = " + r.bytesSent);
alert(r.response);
}
//если ошибка
function fail(error) {
alert("An error has occurred: Code = " = error.code);
}
</script>
</head>
<body>
<button onclick="getImage();">Upload a Photo</button>
</body>
</html>Ну и нам еще нужно что бы сервр что то принимал, по этому PHP код для принятия изображения. Для этого нам нужен сервер или Денвер который сможет интерпретировать php код:
<?php
print_r($_FILES);
$new_image_name = "namethisimage.jpg";
move_uploaded_file($_FILES["file"]["tmp_name"], "/srv/www/upload/".$new_image_name);
?>Тестируем все это в эмуляторе и смотрим загрузилось изображение или нет. Спасибо за внимание.
Комментариев нет:
Отправить комментарий