捕获并存储到本地数据库/ PhoneGap/Cordova/iOS的照片

Question

我目前正在使用Phonegap/Cordova和jQuerymobile为iOS构建一个应用程序。这个想法是用相机拍照并存储拍摄的图像以供将来使用。我想将路径/文件名存储到我的本地数据库中，并将图片文件移至iPhone中的永久位置。

有人能给我一个例子吗？

Answer 1

有3个步骤：

1. 获取照片。苹果有此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的scr填充照片的路径）

  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); 
  } 
  

• 我的文件已保存在数据库中，以显示它，我把“ file：//“包含图像src的行的前面

希望得到这个帮助。 J.

P.S. ： - 非常感谢Simon Mac Donald（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); 
}