Express Angular - Strange JSON receive from POST

Question

I try to learn Express/NodeJS, I work with c9 ide. To use passport framework for authentication, I try to implement a very simple login form, but when I try to send my login informations to my server, he receive the data like this :

{ '{"username":"login","password":"pwd"}': '' }

Instead of the data I log before send :

OBJECT {username: "login", password: "pwd"}

And JSLint said to me it's a valid JSON, why it's send as a key of json object's attribute?

This is my Express server :

var application_root = __dirname,
express = require("express"),
path = require("path"),
mongoose = require('mongoose');

var app = express();
mongoose.connect('mongodb://' + process.env.IP + '/database');
app.configure(function () {
    app.use(express.bodyParser());
    app.use(express.methodOverride());

    var allowCrossDomain = function(req, res, next) {
        res.header("Access-Control-Allow-Origin", "*");
        res.header("Access-Control-Allow-Methods", "GET,PUT,POST,DELETE,OPTIONS");
        res.header("Access-Control-Allow-Headers", "Content-Type, Authorization, X-Requested-With");

        if ('OPTIONS' == req.method) {
          res.send(200);
        } else {
          next();
        }
    };

    app.use(allowCrossDomain);
    app.use(app.router);
    app.use(express.static(path.join(application_root, "public")));
    app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});

app.post('/login', function(req, res, next){
    var obj = req.body;
    console.log(obj);
});

app.listen(process.env.PORT, process.env.IP);

This is my html form :

<div>
    Username :
    <input ng-model="user.username"/>
    Password :
    <input type="password" ng-model="user.password"/>
    <div class="button" ng-click="login()">Login</div>
</div>

This is my angularjs code :

var app = angular.module('app', []).config( function($locationProvider, $routeProvider, $httpProvider) {

$routeProvider
    .when('/', {
        templateUrl: '/partials/home.html',
        controller : 'HomeCtrl'
    })
    .otherwise({
        redirectTo: '/'
    });

$locationProvider.html5Mode(true);
$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
$httpProvider.defaults.withCredentials = true;

}).controller('HomeCtrl', function($scope, $http) {

    $scope.login = function() {
        $http.post('http://website.io/login', $scope.user).success(function(data) {
            console.log(data);
        });
    }; 
})

It's probably a simple problem, but my brain freeze on this now... Sorry for my english and thanking you in anticipation.

I'm not sure but I think it's : $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8'; but application/json send nothing to my server... — Electron, May 23 '13 at 08:42

score 0 · Answer 1 · 2013-05-23T08:45:38.487

0

try to post angular.toJson($scope.user);

i think it's because it's a wrapped angular object

edited May 23 '13 at 08:45

answered May 23 '13 at 08:27

we don't know if it's wrapped – Ven May 23 '13 at 08:29
The get it's undefined for my object. I have the same form for an Restlet api and it's received the json correctly. – Electron May 23 '13 at 08:36
Thanks again for the response but it's still not this, I try some methods toJson parseJson json stringify, but not one work for me.. maybe cross domain with wrong content-type header? I don't find ^^ – Electron May 23 '13 at 08:47
try just using vanilla `JSON.parse` – citizenslave Feb 11 '14 at 18:56

score 0 · Answer 2 · edited May 23 '17 at 12:04

I have the same problem but you might already solve this issue I just fixed it by use option TransformRequest

like this

var transform = function(data){
    return $.param(data);
 }

$http.post("/foo/bar", requestData, {
    headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},
    transformRequest: transform
}).success(function(responseData) {
    //do stuff with response
});

I found from this link

Express Angular - Strange JSON receive from POST

2 Answers2