Захват и сохранение снимка, сделанного с помощью камеры, в локальную базу данных/PhoneGap/Cordova/iOS

Question

В настоящее время я создаю приложение для iOS, используя Phonegap/Cordova и jQuerymobile. Идея состоит в том, чтобы сфотографировать камеру и сохранить захваченное изображение для будущего использования. Я хотел бы сохранить путь/имя файла в моей локальной базе данных и переместить файл изображения в постоянное место на iPhone.

Может ли кто-нибудь предоставить мне пример?

Answer 1

Есть 3 шага:

1. Получить фотографию. Apple, имеет хороший пример для этого on the iPhone dev site
2. Получить каталог Документы, например, так:

   
   NSArray *arrayPaths = NSSearchPathForDirectoriesInDomains(
         NSDocumentDirectory, 
         NSUserDomainMask, 
         YES); 
   NSString *docDir = [arrayPaths objectAtIndex:0]; 
   

3. И, наконец, хранение UIImage вы получили в шаге 1 на диск:

   
   NSString *filename = @"mypic.png"; 
   NSString *fullpath = [docDir stringByAppendingPathComponent:filename]; 
   [UIImagePNGRepresentation(image) writeToFile:fullpath atomically:YES]; 
   

Answer 2

Хорошо, здесь является решением.

• в файле Html

• У меня есть тег изображения для отображения снимок, сделанный камерой:

• У меня есть кнопка, которая запускает функцию для съемки фото: Захват фото

• Функция, предназначенная для съемки фотографии (при фотосъемке, сглаживание «smallImage» id заполнено дорожкой фотографии)

  function capturePhoto() { 
  // Take picture using device camera and retrieve image as base64-encoded string 
      navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50 }); 
  } 
  
  //Callback function when the picture has been successfully taken 
  function onPhotoDataSuccess(imageData) {     
      // Get image handle 
      var smallImage = document.getElementById('smallImage'); 
  
      // Unhide image elements 
      smallImage.style.display = 'block'; 
      smallImage.src = imageData; 
  } 
  
  //Callback function when the picture has not been successfully taken 
  function onFail(message) { 
      alert('Failed to load picture because: ' + message); 
  } 
  

• Теперь я хочу, чтобы переместить изображение в постоянной папке, а затем сохранить ссылку в моей базе данных:

  function movePic(file){ 
      window.resolveLocalFileSystemURI(file, resolveOnSuccess, resOnError); 
  } 
  
  //Callback function when the file system uri has been resolved 
  function resolveOnSuccess(entry){ 
      var d = new Date(); 
      var n = d.getTime(); 
      //new file name 
      var newFileName = n + ".jpg"; 
      var myFolderApp = "EasyPacking"; 
  
      window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) {  
      //The folder is created if doesn't exist 
      fileSys.root.getDirectory(myFolderApp, 
          {create:true, exclusive: false}, 
          function(directory) { 
           entry.moveTo(directory, newFileName, successMove, resOnError); 
          }, 
          resOnError); 
          }, 
      resOnError); 
  } 
  
  //Callback function when the file has been moved successfully - inserting the complete path 
  function successMove(entry) { 
      //I do my insert with "entry.fullPath" as for the path 
  } 
  
  function resOnError(error) { 
      alert(error.code); 
  } 
  

• Мой файл был сохранен в базе данных, чтобы отобразить его, я поставил " файл: // "фронт строки, содержащей изображение src

Надеюсь, эта помощь. J.

P.S. : - большое спасибо Саймону Мак Дональду (http://hi.im/simonmacdonald) за сообщение на googledocs.

Answer 3

Ответ Джерома работает как шарм. Единственное, что нужно указать людям, когда они хотят использовать файл, не использовать entry.fullPath, поскольку это иногда может вызвать проблемы, используйте entry.toURL(), поскольку это будет дать вам полный путь без добавления «файл: //» в пути, а также в обход проблем, таких как хранение SD карты ..

Answer 4

if (index == '0') 
{ 
    var options = { 
     quality: 50, 
     destinationType: Camera.DestinationType.FILE_URI, 
     sourceType: Camera.PictureSourceType.CAMERA, 
     allowEdit: false, 
     encodingType: Camera.EncodingType.JPEG, 
     popoverOptions: CameraPopoverOptions, 
     saveToPhotoAlbum: false, 
     correctOrientation:true 
    }; 

    $cordovaCamera.getPicture(options).then(movePic,function(imageData) { 
     $rootScope.imageUpload=imageData; 
    }, function(err) { 
     console.error(err); 
    }); 

    function movePic(imageData){ 
     console.log("move pic"); 
     console.log(imageData); 
     window.resolveLocalFileSystemURL(imageData, resolveOnSuccess, resOnError); 
    } 

    function resolveOnSuccess(entry){ 
     console.log("resolvetosuccess"); 

     //new file name 
     var newFileName = itemID + ".jpg"; 
     var myFolderApp = "ImgFolder"; 

     window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) { 
      console.log("folder create"); 

      //The folder is created if doesn't exist 
      fileSys.root.getDirectory(myFolderApp, 
       {create:true, exclusive: false}, 
       function(directory) { 
        console.log("move to file.."); 
        entry.moveTo(directory, newFileName, successMove, resOnError); 
        console.log("release"); 

       }, 
       resOnError); 
     }, 
     resOnError); 
    } 

    function successMove(entry) { 
     //I do my insert with "entry.fullPath" as for the path 
     console.log("success"); 
     //this is file path, customize your path 
     console.log(entry); 
    } 

    function resOnError(error) { 
     console.log("failed"); 
    } 

} 

Answer 5

Я просто сделал, что работает с обещаниями, на основании ответа Иеронима выше:

function moveFile(file){ 

    var deferred = $q.defer(); 

    window.resolveLocalFileSystemURL(file, 
     function resolveOnSuccess(entry){ 

      var dateTime = moment.utc(new Date).format('YYYYMMDD_HHmmss'); 
      var newFileName = dateTime + ".jpg"; 
      var newDirectory = "photos"; 

      window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) { 

        //The folder is created if doesn't exist 
        fileSys.root.getDirectory(newDirectory, 
         {create:true, exclusive: false}, 
         function(directory) { 

          entry.moveTo(directory, newFileName, function (entry) { 
           //Now we can use "entry.toURL()" for the img src 
           console.log(entry.toURL()); 
           deferred.resolve(entry); 

          }, resOnError); 
         }, 
         resOnError); 
       }, 
       resOnError); 
     }, resOnError); 

    return deferred.promise; 
} 

function resOnError(error) { 
    console.log('Awwww shnap!: ' + error.code); 
}