sending JSON to Express

Question

I read many posts about how to send json to express via post but none worked or fixed my issue.

my issue is that when reading req.body where req is the request object i get an output like this : { '{"z":"z"}': '' } for this obejct i sent {z:"z"}

That is not expected and not any kind of behavior is saw before.

this si the angular httpClient request :

return new Promise((res,rej)=>{
        this.http.post("http://localhost:3000/Auth/Login",{z:"z"},{headers:new HttpHeaders('Content-Type:application/x-www-form-urlencoded')})
            .toPromise()
              .then(
              response =>{
               res(response)
              }
              ).catch(
                  err=>{
                      rej(err)
                  }
              )
    })

This is the server code :

router.route('/Login').all(function (req, res, next) {
    next();
}).post(function(req, res, next) {
    console.log(req.body);})

what i want is to get the same object i sent that is it.

Help !

That creates an OPTIONS request ( preflight request ) and it doesn't get a good response and the requesst fails. i had the chrome extension on but didn't do anything — Kaki Master Of Time, Mar 16 '18 at 12:26
I did try that, It works perfectly when i send with x-www-form-urlencoded but not with raw :`{z:"z"}` which is what i want to send — Kaki Master Of Time, Mar 16 '18 at 12:59
I send exactly this in raw : " {z:"z"} " without the quotes at first — Kaki Master Of Time, Mar 16 '18 at 13:01
Yes, i use that already. the project is generated using the official express generator, so technically all best options are there. — Kaki Master Of Time, Mar 16 '18 at 13:04
Could you just try it out yourself, using angular httpclient as sender? — Kaki Master Of Time, Mar 16 '18 at 13:06
http is just a local name for the injected HttpClient `constructor(private http:HttpClient){...}` — Kaki Master Of Time, Mar 16 '18 at 13:22
have you had a look at this https://stackoverflow.com/questions/46714480/httpclient-post-request-using-x-www-form-urlencoded/46714814 question? — Shyam Babu, Mar 16 '18 at 14:15

ambussh · Accepted Answer · 2018-03-16T20:36:16.843

In service (or where you use connection with api) use HttpClient from @angular/common/http - because only in the HttpClient you can use HttpHeaders.

Example with simple service:

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';

@Injectable()
export class AppService {

  constructor(private http: HttpClient) { }

  toparams = function ObjecttoParams(obj) {
    var p = [];
    for (var key in obj) {
      p.push(key + '=' + encodeURIComponent(obj[key]));
    }
    return p.join('&');
  };

  login(): any {
    return new Promise((res, rej) => {
      let obj = { z: "z" };
      this.http.post("http://localhost:3000/Login", this.toparams(obj), {headers:new HttpHeaders('Content-Type:application/x-www-form-urlencoded')})
        .toPromise()
        .then( response => {
            res(response)
          }
        ).catch(err => {
            rej(err)
          }
        )
    })
  };
}

In module:

import { HttpModule } from "@angular/http"
...
imports: [
  ....
  HttpModule
],

Node.js + express example:

var express = require('express');
var app = express()
var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: true })); // support encoded bodies

app.all("/*", function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Cache-Control, Pragma, Origin, Authorization, Content-Type, X-Requested-With, X-Auth");
    res.header("Access-Control-Allow-Methods", "GET, PUT, POST");
    return next();
});

app.route('/Login').all(function(req, res, next) {
    next();
}).post(function(req, res, next) {
    console.log(req.body);
    res.json(req.body)
});

app.listen(3000)

Now when you send { z: "z" } api will return the same object he will not parse it to JSON.

Would not it be easier to get JSON?

It worked, But isn't this just a workaround with the son to params parsing ? — Kaki Master Of Time, Mar 19 '18 at 08:14

sending JSON to Express

1 Answers1