Я пытался захватить изображение и загрузить его на сервер в течение нескольких дней, но безуспешно.
Я использую Ionic 4 для своей клиентской стороны и Java в качестве моего бэкэнда (я использовал Джерси, чтобы выставить свой бэкэнд для REST).
Теперь проблема в том, что после получения изображения и его загрузки я продолжаю получать ноль в своем бэкэнде.
Вот мой код на стороне клиента:
openCam(){
const options: CameraOptions = {
quality: 100,
destinationType: this.camera.DestinationType.FILE_URI,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
correctOrientation: true,
cameraDirection: 1
}
this.camera.getPicture(options).then((imageData) => {
// imageData is either a base64 encoded string or a file URI
// If it's base64 (DATA_URL):
//alert(imageData)
this.imageData = imageData;
this.image=(<any>window).Ionic.WebView.convertFileSrc(imageData);
this.isImageCaptureed = true;
}, (err) => {
// Handle error
alert("error "+JSON.stringify(err))
});
}
upload(){
let url = 'http://mydommain/api/upload';
let dataURL = 'data:image/jpeg;base64,' + this.imageData;
let postData = new FormData();
postData.append('file', dataURL);
let data:Observable<any> = this.http.post(url,postData);
data.subscribe((result) => {
console.log(result);
});
}
Я пытался передать imageData
непосредственно в FormData
объект, я также пытался преобразовать его с помощью функции DataURIToBlob()
, как я обнаружил при некоторых других подобных проблемах, но все еще не повезло ..
dataURItoBlob(dataURI) {
// convert base64/URLEncoded data component to raw binary data held in a string
var byteString;
if (dataURI.split(',')[0].indexOf('base64') >= 0)
byteString = atob(dataURI.split(',')[1]);
else
byteString = unescape(dataURI.split(',')[1]);
// separate out the mime component
var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];
// write the bytes of the string to a typed array
var ia = new Uint8Array(byteString.length);
for (var i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
return new Blob([ia], {type:mimeString});
}
Я знаю, что проблема только в формате imageData
. Так как мне удалось отправить, чтобы выбрать файл, используя тег ввода HTML, и загрузить его, используя ту же функцию upload()
, что и выше, и мой бэкэнд API.