0

I am developing an ionic app when I am sending a post request using angularjs $http.post to my express js server, I cannot see the data in the req.body.

I am running my server on localhost:3000

Code in my server for CORS

     app.use(function(req, res, next) {
     res.header("Access-Control-Allow-Origin", "*");
     res.header("Access-Control-Allow-Headers", "Content-Type");
     res.header("Access-Control-Allow-Methods", "GET,PUT,DELETE,POST");
     next();
     });

My angular Js post request

        $http.post('http://localhost:3000/signup',{"username":"x","password":"y"}).success(function(res){

     console.log(res);
     if(res.msg=="success")
     {
       //do something
     }
}

I am able to see data in req.body as "key" like:
{'{"username":"x","password":"y"}':''}
When I am setting the header from ionic app as:

$http.defaults.headers.post["Content-Type"] = 'application/x-www-form-   urlencoded; charset=UTF-8';

Please let me know how to debug this

George Kagan
  • 5,913
  • 8
  • 46
  • 50
mBlaze
  • 401
  • 1
  • 5
  • 7
  • 1
    are you using `body-parser` ? and if yes did you add `app.use(parser.urlencoded({ extended: true }));` ? – georoot Dec 04 '16 at 20:37
  • @georoot I have this in my app.js app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: false })); I also tried with app.use(bodyParser.urlencoded({ extended: true })) but got the same response – mBlaze Dec 04 '16 at 20:58
  • you mean to say that `req.body` in your case is empty ? if yes inspect the ajax request and post that over so we can see how exactly are the parameters posted to the server :) – georoot Dec 04 '16 at 21:05
  • @georoot this how my ajax request looks like – mBlaze Dec 04 '16 at 21:14
  • See this answer -- [SO: Url Encoding in AngularJS front end](http://stackoverflow.com/a/40963970/5535245) – georgeawg Dec 04 '16 at 22:18

2 Answers2

0

You are getting the entire data as key in req.body. This is because the angular request that you are making is wrong. Here is the part of code that should work

$http({
    url: 'http://localhost:3000/signup',
    method: "POST",
    data: { username : "a" , password : "b" }
})
.then(function(response) {
        // success
}, 
function(response) { // optional
        // failed
});
georoot
  • 3,557
  • 1
  • 30
  • 59
  • Thanks but my ajax request from client is going in this format after parsing Form Data parsed {"firstname":"a","lastname":"b","email":"abc@gmail.com","password":"12345678"}: and I am receiving the same in body at express server – mBlaze Dec 04 '16 at 21:29
  • So what I think is I am not able to parse the form data correctly from my ionic app. Any suggestions what i can do to change it – mBlaze Dec 04 '16 at 21:31
  • Try passing data as `{ username : "a" , password : "b" }` – georoot Dec 04 '16 at 21:31
  • For give you more details Resposne Headers Access-Control-Allow-Headers:Content-Type Access-Control-Allow-Methods:GET,PUT,DELETE,POST Access-Control-Allow-Origin:* Connection:keep-alive Content-Length:19 Content-Type:application/json; charset=utf-8 Request Headers Accept:*/* Accept-Encoding:gzip, deflate, br Accept-Language:en-US,en;q=0.8 Connection:keep-alive Content-Length:78 Content-Type:application/x-www-form-urlencoded; charset=UTF-8 Host:localhost:3000 Origin:http://localhost:8100 Referer:http://localhost:8100/?ionicplatform=android – mBlaze Dec 04 '16 at 21:32
0

Well I figured that out I have used this stackoverflow link Ionic framework http post request to parse my data before its send to my server

  $http.defaults.headers.post["Content-Type"] = 'application/x-www-form-urlencoded; charset=UTF-8';
   Object.toparams = function ObjecttoParams(obj)
   {
     var p = [];
     for (var key in obj)
     {
       p.push(key + '=' + encodeURIComponent(obj[key]));
     }
     return p.join('&');
   };

   $http({
     url: 'http://localhost:3000/signup',
     method: "POST",
     data: Object.toparams(u)
   })
     .then(function(response) {
         console.log(response);
       },
       function(response) { // optional
         // failed
       });
Community
  • 1
  • 1
mBlaze
  • 401
  • 1
  • 5
  • 7