icordova拍照,如何使用Cordova相机正确配置照片文件以匹配html input.files的格式?...

I have an existing web service that handles user input of a photo (as well as some other number and text data). The photo is captured via the input tag:

In the javascript I grab the image via the Files API like so:

$('#image-input-solo').on('change', function() {

window.__file = this.files[0];

});

// which gives me a File Object like this:

File {

lastModified: 1507749812264

lastModifiedDate: Wed Oct 11 2017 12:23:32 GMT-0700 (PDT) {}

name: "image000987u.jpg"

size: 441738

type: "image/jpeg"

webkitRelativePath: ""

__proto__: File

}

So in my native app context (using Cordova and the Camera Plugin) I am successfully grabbing the photo file:

//HTML

// JAVASCRIPT

$scope.nativeCamera = function() {

if (!navigator.camera) {

alert("Camera API not supported", "Error");

return;

}

var options = { quality: 100,

destinationType: Camera.DestinationType.FILE_URI,

sourceType: 1, // 0:Photo Library, 1=Camera, 2=Saved Album

encodingType: 0 // 0=JPG 1=PNG

};

navigator.camera.getPicture(

function(imgData) {

var fd = new FormData();

var reader;

var imgBlob;

window.resolveLocalFileSystemURL(imgData, function(fileEntry) {

fileEntry.file(function(file) {

reader = new FileReader();

reader.onloadend = function(e) {

imgBlob = new Blob([ this.result ], { type: "image/jpeg" } );

fd.append('attachment', imgBlob);

window.__file = imgBlob; // MY ATTEMPT TO GET THE IMAGE IN THE CORRECT WAY

};

reader.readAsArrayBuffer(file);

}, function(e){

console.log('error with photo file');

});

}, function(e){

console.log('error with photo file');

});

},

function() {

alert('Error taking picture', 'Error');

},

options);

};

// THE OBJECT I GET FORM THE imgBlob:

Blob {

size: 6268043

type: "image/jpeg"

}

My question is, how can I get the photo file from the native camera and format it into the same File Object as I get from the HTML input, this.files[0] so I can continue using my existing web service to store the photo?

解决方案

Turns out it was a simple fix:

navigator.camera.getPicture(

function(imgData) {

var fd = new FormData();

var reader;

var imgBlob;

window.resolveLocalFileSystemURL(imgData, function(fileEntry) {

fileEntry.file(function(file) {

reader = new FileReader();

reader.onloadend = function(e) {

imgBlob = new Blob([ this.result ], { type: "image/jpeg" } );

window.__file = imgBlob; // PLACE THE FILE ASSIGNMENT HERE AFTER THE READER HAS INGESTED THE FILE BYTES

};

reader.readAsArrayBuffer(file);

// window.__file = imgBlob; // FILE ASSIGNMENT USED TO BE HERE

}, function(e){

console.log('error with photo file');

});

}, function(e){

console.log('error with photo file');

});

},

function() {

alert('Error taking picture', 'Error');

},

options);

};

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值