Hi,
I just want to take a photo and display it as an attachment if photo exists.
<ion-row >
<ion-col size="12">
<div *ngIf="photo.webviewPath">
<ion-img [src]="photo.webviewPath" (click)="showRemoveSheet()"></ion-img>
</div>
</ion-col>
</ion-row>
This is my method for taking a photo returned as UserPhoto-Object. At the end you see the line “webviewPath: capturedPhoto.webPath || ‘empty’”. It returns the string “empty”. Why? Then I get a source error “http/1.1 404 not found http://localhost:8100:empty”.
The comment explains: Use webPath to display the new image instead of base64 since it’s already loaded into memory!?
public async selectAttachImage(): Promise<UserPhoto> {
const capturedPhoto = await Camera.getPhoto({
resultType: CameraResultType.Base64,
source: CameraSource.Camera, // Camera, Photos or Prompt!
quality: 100,
allowEditing: false});
const base64Data = await this.readAsBase64(capturedPhoto);
// Write the file to the data directory
const fileName = 'user_photo_tmp.jpeg';
const savedFile = await Filesystem.writeFile({
path: fileName,
data: base64Data,
directory: Directory.Data
});
if (this.platform.is('hybrid')) {
// Display the new image by rewriting the 'file://' path to HTTP
// Details: https://ionicframework.com/docs/building/webview#file-protocol
return {
filepath: savedFile.uri,
webviewPath: Capacitor.convertFileSrc(savedFile.uri),
};
} else {
// Use webPath to display the new image instead of base64 since it's
// already loaded into memory
return {
filepath: fileName,
webviewPath: capturedPhoto.webPath || 'empty'
};
}
}