How to send image with http.post

Question

I would like to send image with http.post. I use that code block , but gives me 404 error. I tried api on postman , return success.

Where is my wrong?

Thanks.

changeprofileimg()
  {
    this.camera.getPicture({
      sourceType: this.camera.PictureSourceType.PHOTOLIBRARY,
      destinationType: this.camera.DestinationType.DATA_URL,
      quality: 100,
      encodingType: this.camera.EncodingType.PNG,
      targetHeight:500,
      targetWidth:500,
      correctOrientation:true
    }).then(imageData => {

      const image = 'data:image/jpeg;base64,'+imageData;   
      var veri;   
      var headers = new Headers();
      headers.append('Accept', 'application/json');
      headers.append('Authorization' , 'Bearer '+this.globalvars.getToken());
      headers.append('Content-Type', 'multipart/form-data');
      let options = new RequestOptions({ headers: headers });


      let postParams = {
        file:image
      }

      this.http.post("http://.../api/profile/image/upload", postParams, options)
        .subscribe(data => {
          console.log( data['_body']);
          veri=data['_body'];
          veri = veri.replace(/\\/g, "");
          veri = JSON.parse(veri);
          console.log(veri);
        });

    });
  }

score 4 · Answer 1 · answered Oct 10 '17 at 15:43

4

You should use FormData for this purpose:

      let formData = new FormData();
      formData.append('file', image);


      this.http.post("http://.../api/profile/image/upload", formData, options)
        .subscribe(data => {
          console.log( data['_body']);
          veri=data['_body'];
          veri = veri.replace(/\\/g, "");
          veri = JSON.parse(veri);
          console.log(veri);
        });

    });

Besides that as you're getting an 404 error, so you should double check your api endpoints and rest api methods.

answered Oct 10 '17 at 15:43

asmmahmud

4,844
2
40
47

I added this code still return "{"code":404,"status":"FAIL","message":"File Load Error"}" – Ahmet emre CETIN Oct 10 '17 at 17:02
Most probably there is some problems in your api related endpoint because you're getting 404 http status. – asmmahmud Oct 10 '17 at 17:03
you may send image as base64, so it might not accept base64 image data. – Abhishek Pandya Mar 22 '18 at 15:02

How to send image with http.post

1 Answers1