Cordova：将图像和位置上传到数据库，然后加载最近的图像

Question

我正在尝试使用Cordova构建应用程序。使用应用程序你应该拍照，这些图片需要与拍摄照片的位置一起上传到数据库。默认情况下，该应用会向您的实际位置显示最近拍摄照片的x个数字。在这里我发布我现在的javascript代码，大部分代码来自Cordova s​​elf。修改此代码或重新开始是否更好？

我现在可以访问相机拍照了，但是如何将这张照片和位置一起上传到数据库？

如何从数据库中加载最近的图片？

var Latitude = undefined;
var Longitude = undefined;

window.onload = function onLoad() {
    document.addEventListener("deviceready", onDeviceReady, false);
}

function onDeviceReady(){
    navigator.notification.alert("ready");
    document.getElementById("camera").addEventListener 
        ("click", cameraTakePicture); 
}

function cameraTakePicture() { 
    navigator.camera.getPicture(onSuccess, onFail, {  
       quality: 50, 
       destinationType: Camera.DestinationType.DATA_URL 
    });  

  function onSuccess(imageData, imageURI) { 
     var image = document.getElementById('myImage'); 
     image.src = "data:image/jpeg;base64," + imageData;
     getLocation();
     navigator.notification.alert(image.src);
  }  

  function onFail(message) { 
     alert('Failed because: ' + message); 
  } 
 }

 function getLocation() {
    navigator.notification.alert("start locatie");
    navigator.geolocation.getCurrentPosition(onPicturesSuccess, onPicturesError, { enableHighAccuracy: true });
 }

var onPicturesSuccess = function (position) {

  Latitude = position.coords.latitude;
  Longitude = position.coords.longitude;

  getPictures(Latitude, Longitude);
}

function getPictures(latitude, longitude) {
  //Load pictures which are the nearest
}

var onPicturesWatchSuccess = function (position) {

   var updatedLatitude = position.coords.latitude;
   var updatedLongitude = position.coords.longitude;

   if (updatedLatitude != Latitude && updatedLongitude != Longitude) {

     Latitude = updatedLatitude;
     Longitude = updatedLongitude;

     getPictures(updatedLatitude, updatedLongitude);
   }
}

// Error callback

function onPicturesError(error) {

   console.log('code: ' + error.code + '\n' +
       'message: ' + error.message + '\n');
}

// Watch your changing position

function watchPicturePosition() {

   return navigator.geolocation.watchPosition
   (onPicturesWatchSuccess, onPicturesError, { enableHighAccuracy: true });
}

Answer 1

您可以使用Cordova File Transfer Plugin将照片上传到后端服务（DB）。在FT插件中，您可以添加一些额外的标题或属性，例如LAT和LON属性。

Answer 2

由于您没有特别提及它，我将假设您可以访问Cordova应用程序中的jQuery。

在onSuccess中，您必须进行AJAX调用，将图像和位置提交给PHP服务器。以下是一个例子：

var request = {
  'url': 'path/to/your/php/script.php',
  'method': 'POST',
  'data': {
    'image': image.src,
    'location': getLocation()
  }
}
$.ajax(request).done(function(response) {
  // request is done
});

您的PHP服务器脚本必须获取传入的数据并将其保存到您的数据库。