Only 1px image is uploaded to the server when using native. Working normally in browser

Capacitor
1

I used Ionic 5 with Capacitor 2. Here’s my project info:
Ionic:

Ionic Framework : @ionic/angular 5.5.4
@angular/cli : 11.2.2

Capacitor:

Capacitor CLI : 2.4.2
@capacitor/android : 2.4.6
@capacitor/core : 2.4.2

npm : 6.14.18

Here’s my upload photo service. It is called when user selected to upload photo via camera or gallery:

async addProfilePicture(source) {
    this.profileUpload = [];
    const capturedId = await Camera.getPhoto({
      resultType: CameraResultType.Uri,
      source: source,
      quality: 100,
      allowEditing: false
    });

    this.profilePicture.unshift({filepath:'',webviewPath:capturedId.webPath});

    // For server upload
    const response = await fetch(capturedId.webPath!)
    const  blob = await response.blob();
    this.profileUpload.push(blob);
  }

after that, i have a service call post the this.profileUpload to the server.

editProfile(form): Observable<any>{
    const profileData = new FormData();
    profileData.append('firstName', form.value.firstname);
    profileData.append('lastName', form.value.lastname);
    profileData.append('phoneNumber', form.value.phoneNumber);
    profileData.append('bio', form.value.bio);
    for (let pic of this.profileUpload){
      profileData.append('avatar', pic);
    }
    return this.http.post(this.userApi+'profile/edit', profileData);
  }

It works normally when I test from browser and using Postman. But when I test in Android Studio emulator or install apk in real device, it doesnt work. In fact when I check the uploaded image and open it in a browser, it shows an image of 1px.