Phonegap - Lấy ảnh từ Camera Roll qua đường dẫn

Question

Trong ứng dụng PhoneGap/jQuery Mobile của tôi, tôi hiện đang sử dụng API Camera của PhoneGaps để cho phép người dùng chụp ảnh, cũng được lưu trữ trong Camera Roll. Tôi đang đặt DestinationType thành FILE_URI và lưu đường dẫn này trong một db cục bộ. Tuy nhiên, FILE_URI là đường dẫn đến vị trí tạm thời bị hủy khi ứng dụng bị đóng. Tôi đã nghĩ đến việc lưu tên của hình ảnh và sau đó lấy hình ảnh từ Camera Roll. Có một con đường tôi có thể sử dụng để sau này lấy các hình ảnh trong Camera Roll?

tôi đã tiết kiệm những hình ảnh như Base64 trong db, nhưng tôi là một chút mệt mỏi của phương pháp này vì ghi chú này trong PhoneGap API Doc:

Lưu ý: Chất lượng hình ảnh của hình ảnh được chụp bằng máy ảnh trên các thiết bị mới hơn khá tốt. Việc mã hóa các hình ảnh như vậy bằng Base64 đã gây ra các sự cố bộ nhớ trên một số thiết bị này (iPhone 4, BlackBerry Torch 9800). Do đó, việc sử dụng FILE_URI vì 'Camera.destinationType' là được khuyến nghị.

EDIT:

Got nó làm việc với các câu trả lời @Simon MacDonald. Đây là mã xuống tước của tôi:

function capturePhoto() { 
    navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 25, destinationType: Camera.DestinationType.FILE_URI }); 
} 

function onPhotoURISuccess(imageURI) { 
    createFileEntry(imageURI); 
} 

function createFileEntry(imageURI) { 
    window.resolveLocalFileSystemURI(imageURI, copyPhoto, fail);  
} 

function copyPhoto(fileEntry) { 
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) { 
     fileSys.root.getDirectory("photos", {create: true, exclusive: false}, function(dir) { 
       fileEntry.copyTo(dir, "file.jpg", onCopySuccess, fail); 
      }, fail); 
    }, fail); 
} 

function onCopySuccess(entry) { 
    console.log(entry.fullPath) 
} 

function fail(error) { 
    console.log(error.code); 
} 

Answer 1

Sau khi bạn lấy các tập tin bằng cách sử dụng phương pháp FILE_URI bạn nên sử dụng File API để sao chép hình ảnh từ thư mục tạm thời đến thư mục Documents and lưu trữ các con đường mới trong DB của bạn .

Vì vậy, bạn sẽ lấy kết quả của getPicture() của bạn vượt qua nó để window.resolveLocalFileSystemURI() để có được một FileEntry. Sau đó, bạn có thể gọi phương thức FileEntry.copyTo() để sao lưu tệp của mình.

Answer 2

Tính đến Cordova 1.8 này hoạt động tốt, xem:

http://docs.phonegap.com/en/1.8.0/cordova_camera_camera.md.html#Camera

Answer 3

Xin lỗi mà tôi đã phải tạo ra một bài riêng biệt bởi vì tôi không có đủ uy tín để bình luận.

Cảm ơn Simon vì lời khuyên và Casey về giải pháp.

Tôi đang làm việc trên ứng dụng Cordova yêu cầu tôi chụp ảnh trên iOS, lưu ảnh trong thư mục và liên kết trên bộ nhớ cục bộ để truy cập sau này. Sau khi người dùng gửi ảnh, ứng dụng cần xóa ảnh khỏi thư mục.

Dưới đây là thêm mã về cách bạn có thể làm điều đó và cách bạn có thể xem thư mục Tài liệu dự án.

Bạn có thể lấy thư mục đầy đủ của ảnh bạn muốn xóa bằng cách sử dụng $ ('# pictureid'). Attr ('src').

function deletePic(file){ 
    console.log("deleting: "+file+"..."); 
    var file = "photos/"+file.toString().split('/').slice(-1)[0]; //gets photo name 

    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys){ 
    fileSys.root.getFile(file, 
       {create:false}, 
       function(entry){ 
        entry.remove(); 
       }, resOnErrorDelete); 
       }, 
    resOnErrorDelete);   
} 

function resOnErrorDelete(error) { 
    console.log("resOnErrorDelete: "+error.code); 
} 

Hoặc nếu bạn có biểu mẫu có nhiều tệp đính kèm ảnh, bạn có thể muốn cung cấp thư mục Tài liệu mà bạn đã tạo để lưu trữ ảnh duy nhất. Bằng cách này, bạn có thể xóa toàn bộ thư mục sau khi bạn gửi hàng loạt ảnh thay vì xóa từng ảnh một.

function deleteFolder(folder){ 
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys){ 
    fileSys.root.getDirectory(folder, 
       {create:true, exclusive: false}, 
       function(entry){ 
        entry.removeRecursively(); 
       }, resOnErrorDelete); 
       }, 
    resOnErrorDelete);   
} 

function resOnErrorDelete(error) { 
    console.log("resOnErrorDelete: "+error.code); 
} 

Như để truy cập vào thư mục Documents dự án, bạn cần phải chỉnh sửa plist để cho phép iTunes File Sharing

Đến [project_folder]/nền tảng/ios/[PROJECT_NAME]/[PROJECT_NAME] -Info.plist. Nhấp chuột phải và mở bằng XCode.

Bạn sẽ thấy một bảng khóa. Nhấp chuột phải vào bất kỳ vị trí nào bên dưới bảng và Thêm hàng. Một hàng mới sẽ được tạo. Nhấp đúp vào khóa và nhập UIFileSharingEnabled. Nó sẽ tự động thay đổi thành Ứng dụng hỗ trợ chia sẻ tệp iTunes, đặt giá trị khóa đó cho CÓ.

Bây giờ nếu bạn truy cập iTunes dưới ứng dụng của thiết bị iOS, hãy cuộn xuống hết cỡ để xem khu vực Chia sẻ tệp nơi bạn có thể xem thư mục của mình. Tuy nhiên, nó chỉ có cho bạn để 'Lưu vào' nhưng không chỉnh sửa.

Hy vọng tất cả các thông tin bổ sung này sẽ giúp ích. Nó đã cho tôi 2 ngày nghiên cứu để tìm hiểu.

Answer 4

Chia sẻ phiên bản sử dụng lời hứa và giải quyếtLocalFileSystemURL ngoại trừ giải phápLocalFileSystemURI bởi vì phiên bản thứ hai không còn được dùng nữa. Nó cũng sử dụng tên tệp gốc trong tên tệp mới được tạo.

function copyPhotoToAppDir(imageURI) { 
    if(!imageURI){ 
    console.warn("You need to pass imageURI"); 
    return; 
    } 

    var fileNameSplit = imageURI.split("/"), 
    fileName = fileNameSplit[fileNameSplit.length - 1], 
    deferred = $q.defer(); 

    var copyPhoto = function(fileEntry) { 
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) { 
     fileSys.root.getDirectory("photos", {create: true, exclusive: false}, function(dir) { 
     fileEntry.copyTo(dir, fileName, onCopySuccess, onFileFail); 
     }, onFileFail); 
    }, onFileFail); 
    }; 

    var onCopySuccess = function onCopySuccess(entry) { 
    console.log("NEW PATH", entry.fullPath); 
    deferred.resolve(entry.fullPath); 
    }; 

    var onFileFail = function (error) { 
    console.log("COPY FAIL", error); 
    deferred.reject(); 
    }; 

    window.resolveLocalFileSystemURL(imageURI, copyPhoto, onFileFail); 

    return deferred.promise; 
} 

Cách sử dụng:

var uri = "path1"; 
copyPhotoToAppDir(uri).then(function(newURI){ 
    console.log(newURI); 
}); 

Nhiều URI sử dụng:

var uriArr = ["path1", "path2"]; 
    copyPhotoPromises = []; 

uriArr.forEach(function(val){ 
    copyPhotoPromises.push(copyPhotoToAppDir(val)); 
}); 
$q.all(copyPhotoPromises).then(function(values){ 
    console.log("Array with new paths", values); 
}); 

URI tập tin mới sẽ được lưu dưới dạng "/photos/fileName.jpg". Để có được đường dẫn tuyệt đối, bạn có thể sử dụng:

cordova.file.documentsDirectory + newFileUri.substring(1); 

Tôi đang sử dụng $ q từ góc đây để xử lý hứa hẹn nhưng nó có thể dễ dàng thay đổi để jQuery một.

deferred = $q.defer(); 

sẽ cần phải được thay đổi để:

deferred = jQuery.Deferred(); 

Cheers