Image manipulation with nodejs and ionic

0

I have an Ionic application, in it I have to send a converted image to base64 for an api, and api to the database. I was getting error by the size of the payload, I found on the internet about using the JSON.stringfy, apparently it worked, however, I can not get into the API and store in the database. Here are the codes used:

To perform the conversion:

getPhoto() {
    let options = {
      maximumImagesCount: 1
    };
    this.imagePicker.getPictures(options).then((results) => {
      for (var i = 0; i < results.length; i++) {
          this.imgPreview = results[i];
          this.base64.encodeFile(results[i]).then((base64File: string) => {
            this.regData.avatar = base64File;
            this.novoCredenciadoModel.caminho = this.regData.avatar;
          }, (err) => {
            console.log(err);
          });
      }
    }, (err) => { });
  }

To send to the provider:

register() {
    this.novoCredenciadoService.enviar(this.novoCredenciadoModel).subscribe((result) => {
      // this.loading.dismiss();
      let alert = this.alertCtrl.create({
        title: 'Registration Successful',
        subTitle: 'Great! Your registration is success',
        buttons: ['OK']
      });
      alert.present();
    }, (err) => {
      console.log(err);
      // this.loading.dismiss();
      let alert = this.alertCtrl.create({
        title: 'Registration Failed',
        subTitle: 'Oh no! Your registration is failed',
        buttons: ['OK']
      });
      alert.present();
    });
  }

And no provider:

return this.http.post(Constants.CAMINHO_TESTE+api,JSON.stringify(corpoRequisicao))
    .pipe(map((resp: Response) =>{
      console.log(JSON.stringify(corpoRequisicao));
      console.log("post/response");
      console.log (resp);
      }));

In the API, the following, to receive the data:

var received = JSON.stringify(req);

var nome = received.nome;
var email = received.email;
var telefone = received.telefone;
var endereco = received.endereco;
var cnpj = received.cnpj;
var categoria = received.categoria;
var caminho = received.caminho; //caminho seria a img em base64

But I get the following error:

  

SyntaxError: Unexpected token P in JSON at position 0

Any way to accomplish such a function?

Edit:

 handler: () => {
            this.http.post("minharota/api/novo", JSON.stringify(postData), requestOptions)
              .subscribe(data => {

Postdata is the data that comes from the form, which I think is correct because when I logged in it was normal.

    
asked by anonymous 11.11.2018 / 03:40

1 answer

1
  • You need to move the image to an independent endpoint for upload via your api. Eg POST / api / uploadimage.
  • The required key in your header for the request:

    • Content-Type: application / x-www-form-urlencoded
    • Body: a parameter with some name (example: image) and the value of this would be the base64 image
  • On your route in the Node: API (there are other ways to do this, many even more elegant)

    var imageEncoding = req.body.image.replace(/ /g, "+");
    

    Variable imageEncoding can be saved in a varchar, string, etc. field.

  • Do not forget to configure your api to receive content via larger requests, if that is the case.

    Example with Node and Express:

    app.use(bodyParser.urlencoded({extended: true, limit: '50mb'}));
    app.use(bodyParser.json({limit: '50mb'}));
    
  • If you do not use any tools for communication tests with Rest APIs, I suggest that you use some (the community uses a lot of postman) because they are more minimalistic and make you gain time with these tests.

    I hope I have helped.

        
    12.11.2018 / 04:22