in android studIO {“detail”:[{“type”:“missing”,“loc”:[“body”,“file”],“msg”:“Field required”,“input”:null}]} BUT IN BROSWER GETTING response
import { Component } from ‘@angular/core’;
import { Camera,CameraResultType,CameraSource } from ‘@capacitor/camera’;
import { ModalController } from ‘@ionic/angular’;
import { ScreenReader } from ‘@capacitor/screen-reader’;
import { CameraservicesService } from ‘…/services/cameraservices.service’;
@Component({
selector: ‘app-tab1’,
templateUrl: ‘tab1.page.html’,
styleUrls: [‘tab1.page.scss’]
})
export class Tab1Page {
image:any;
imageBlob!:Blob;
isAlertOpen = false;
msg:any=
alertButtons = [‘Action’];
constructor(private cameraService:CameraservicesService) {}
async selectImage(){
try{
this.isAlertOpen = false;
const image =await this.cameraService.selectImage(CameraSource.Prompt);
this.image=image.webviewPath;
this.imageBlob=image.blob;
if(this.imageBlob){
console.log(‘calling api’)
this.doPost()
}
}
catch(error){
console.error(‘error slecting image:’,error)
}
}
import { Injectable } from ‘@angular/core’;
import { Camera, CameraResultType, CameraSource } from ‘@capacitor/camera’;
import { Filesystem, Directory } from ‘@capacitor/filesystem’;
import { Capacitor, CapacitorHttp, HttpOptions, HttpResponse } from ‘@capacitor/core’
import { Observable } from ‘rxjs/internal/Observable’;
import { from } from ‘rxjs’;
import { rejects } from ‘assert’;
import { resolve } from ‘path’;
import { error } from ‘console’;
@Injectable({
providedIn: ‘root’
})
export class CameraservicesService {
private apilUrl = ‘http://3.109.60.88/scanIngredients/’
constructor() { }
async selectImage(source: CameraSource) {
try {
const image = await Camera.getPhoto({
quality: 90,
allowEditing: false,
resultType: CameraResultType.Uri,
source: source
})
const response = await fetch(image.webPath!);
const blob = await response.blob()
const fileName = new Date().getTime() + '.jpeg';
return { blob, webviewPath: image.webPath }
} catch (error) {
console.error('error', error)
throw error;
}
}
async convertBlobToBase64(blob: Blob) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onerror = reject;
reader.onload = () => {
resolve(reader.result)
};
reader.readAsDataURL(blob);
})
}
async uploadFile(blob: Blob) {
try {
const formData = new FormData();
formData.append(‘file’, blob, ‘image.jpg’)
const respones = await CapacitorHttp.request({
method: 'POST',
url: this.apilUrl,
data: formData,
});
console.log('duggu', respones)
return respones;
} catch (error) {
throw error;
}
}
async doPost(blob: Blob) {
const formData = new FormData();
formData.append(‘file’, blob, ‘image.jpg’)
const options = {
url: this.apilUrl,
data: formData,
};
const response: HttpResponse = await CapacitorHttp.post(options);
console.log('doPostServiceCall', response.data, JSON.stringify(response.data))
return response.data;
};
fileUpload(blob: Blob): Observable {
console.log(‘method in’);
const formData = new FormData();
formData.append(‘file’, blob, ‘image.jpg’);
console.log('Checking platform...', Capacitor.getPlatform());
const platform = Capacitor.getPlatform();
if (platform === 'ios' || platform === 'android') {
console.log('Platform in:', platform);
} else {
console.error('Unsupported platform:', platform);
return new Observable(observer => {
observer.error('Unsupported platform');
});
}
const options: HttpOptions = {
url: this.apilUrl,
headers: { 'Content-Type': 'application/json' },
data: formData,
};
// Convert the CapacitorHttp.post Promise to an Observable using 'from'
return from(
CapacitorHttp.post(options)
.then(res => {
console.log('capacitor in', JSON.stringify(res));
return res.data;
})
.catch(error => {
console.error('Error in CapacitorHttp.post:', error);
throw error;
})
);
}
mainFileUpload(blob: Blob): Observable {
console.log(‘methond in’)
const formData = new FormData();
formData.append(‘file’, blob, ‘image.jpg’)
const options = {
url: this.apilUrl,
headers:{‘Content-Type’:‘application/json’},
data: formData,
};
console.log('platform in ', Capacitor.getPlatform())
return from(CapacitorHttp.post(options).then(res=>{return res.data}).catch(error=>{ console.log('Error in capactior ',error); throw error}) );
}
// async mainFileUpload(blob: Blob): Promise {
// console.log(‘methond in’)
// const formData = new FormData();
// formData.append(‘file’, blob, ‘image.jpg’)
// if (Capacitor.getPlatform() == ‘ios’ || Capacitor.getPlatform() == ‘android’) {
// console.log('platform in ', Capacitor.getPlatform())
// return new Observable(observer => {
// return from(new Promise(async (resolve, reject) => {
// const options: HttpOptions = { url: this.apilUrl, headers: { ‘Content-Type’: ‘application/json’ }, data: formData }
// console.log('promise in ',)
// await
// CapacitorHttp.post
// (options).then(async (res: any) => {
// console.log('capacitor in ', JSON.stringify(res))
// await resolve(res.data)
// }, (error: any) => { reject(error); })
// })).subscribe(observer);
// });
// }
// else{
// console.log('platform in else ', Capacitor.getPlatform())
// this.doPost(blob)
// console.log(‘other platform’)
// }
// }
}
android minfest file
<?xml version="1.0" encoding="utf-8"?><application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:usesCleartextTraffic="true"
android:largeHeap="true"
android:networkSecurityConfig="@xml/network_security_config"
android:theme="@style/AppTheme">
<activity
android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode"
android:name=".MainActivity"
android:label="@string/title_activity_main"
android:theme="@style/AppTheme.NoActionBarLaunch"
android:launchMode="singleTask"
android:exported="true">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<provider
android:name="androidx.core.content.FileProvider"
android:authorities="${applicationId}.fileprovider"
android:exported="false"
android:grantUriPermissions="true">
<meta-data
android:name="android.support.FILE_PROVIDER_PATHS"
android:resource="@xml/file_paths"></meta-data>
</provider>
</application>
<!-- Permissions -->
async doPost(){
const result = await this.cameraService.doPost(this.imageBlob)
console.log(‘doPostRes’,result)
}
setOpen(isOpen: boolean) {
this.isAlertOpen = isOpen;
}
}