pick image from gallery or from camera and upload it to server via API, ionic 2

takepictureandupload.txt

//install camera, file trnasfer plugin from ionic native and it's providers in app.component.ts. then only you can use thse codes in your .ts file. 
 
 
 presentActionSheet() {
     let actionSheet = this.actionSheetCtrl.create({
       title: 'Pick your profile photo',
       buttons: [
         {
           text: 'From Gallery',
           
           handler: () => {
             this.openGallery();
           }
         },
         {
           text: 'From Camera',
           handler: () => {
             this.opencamera();
           }
         },
         {
           text: 'Cancel',
           role: 'cancel',
           handler: () => {
             console.log('Cancel clicked');
           }
         }
       ]
     });

     actionSheet.present();
   }





  openGallery() {
     var options = {
        sourceType: this.camera.PictureSourceType.PHOTOLIBRARY,
        destinationType: this.camera.DestinationType.FILE_URI
      };
      this.camera.getPicture(options).then((imageData)  => {
         // imageData is either a base64 encoded string or a file URI
         // If it's base64:

       const fileTransfer: TransferObject = this.transfer.create();

        let options1: FileUploadOptions = {
           fileKey: 'image_upload_file',
           fileName: 'name.jpg',
           headers: {},
           params: {"app_key":"Testappkey"},
           chunkedMode : false
        
        }

    fileTransfer.upload(imageData, 'your ApI that can take image', options1)
     .then((data) => {
       // success
       alert("success"+JSON.stringify(data));
     }, (err) => {
       // error
       alert("error"+JSON.stringify(err));
     });


      });


  }








  opencamera()
      {
        
         let options = {

             quality: 100
              };


        this.camera.getPicture(options).then((imageData) => {
         // imageData is either a base64 encoded string or a file URI
         // If it's base64:

       const fileTransfer: TransferObject = this.transfer.create();

        let options1: FileUploadOptions = {
           fileKey: 'image_upload_file',
           fileName: 'name.jpg',
           headers: {},
           params: {"app_key":"Testappkey"},
           chunkedMode : false
        
        }

    fileTransfer.upload(imageData, 'your ApI that can take imageyour ApI that can take image', options1)
     .then((data) => {
       // success
       alert("success"+JSON.stringify(data));
     }, (err) => {
       // error
       alert("error"+JSON.stringify(err));
     });


      });

   
  }

Yes sir I have properly get image path and image capture is properly.
I Saw ur capture image code,can u tell me why ur not using "mimeType" in ur code?

If you are able upload image properly from Gallery but it is failing from camera because of 404 issue means, somewhere program is not able to access the captured image. Did u try converting the captured Image path to native URL with cordova-plugin-filepath

Yes sir I have already used native URL with filepath plugin but same result.
Last msg I have asked a question:-
ur not using "mimeType" in ur code.can u explain me why?

Hi, It's long ago I had created this Gist, so I'm finding difficulty in recalling why mimeType is not used. If all the things are correct but still your not able to upload the image captured from camera means, I would suggest you this repository of mine.

1. Convert image captured from camera to base64 format.
2. Ensure Image is converted to base64 format by logging the output of the base64 plugin.
3. Upload base64 to server and convert it into Image file there. All the modern programming language has support to convert base64 into actual file.