I’m implementing a feature for taking a photo with the Camera and choosing a photo from the devices library. I’m using the Camera Plugin.
In ios the upload of a photo from the library works.
But on Android
- the device doesnt ask for the permission for the access of the library but it opens nevertheless
- the upload of the image doesnt work
- when opening the camera it asks for permissions and i can take the photo but the upload doesnt work
I’m getting a 419 error and a “Page expired”.
My code:
Android.manifest
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
page.ts
async openPhotoGallery() {
try {
const checkCameraPermissions = await Camera.checkPermissions();
if (checkCameraPermissions.photos !== 'granted') {
await Camera.requestPermissions({ permissions: ['photos'] });
}
const image = await Camera.getPhoto({
quality: 90,
allowEditing: false,
resultType: CameraResultType.Base64,
source: CameraSource.Photos
});
if (!image) return;
const imageBlob = this.base64ToBlob(image.base64String, 'image/jpeg');
if (!imageBlob) return;
await this.uploadImage(imageBlob);
} catch (err: any) {
console.error(err);
}
}
async uploadImage(image: Blob): Promise<any> {
try {
const token = this.authService.getToken();
if (!token) return;
const imagePathFormData = new FormData();
imagePathFormData.append('myfile', image, "image.jpg");
const fetchOptions = {
method: 'POST',
headers: {
Authorization: `Bearer ${token}`
},
body: imagePathFormData,
};
const response = await fetch(fetchOptions);
if (!response.ok) {
console.error(`Fehler: ${response.status}`);
throw new Error(`Upload fehlgeschlagen: ${response.text()}`);
}
if (!response) return;
return response;
} catch (err) {
throw err;
}
}