CODEWITHSUNDEEP
javascriptangularjsnode.jsexpress
Ben Melito
Ben Melito

Reputation: 141

Data undefined at Node.js from AngularJS POST request

I am attempting to send a fairly simple POST request to my server using AngularJS. The request goes through and hits my controller on the back end, but for some reason req.data is showing up as undefined.

Front End Controller:

function CardDirectiveController($http, $scope) {
    var self = this;

    self.addToFavorites = function() {
        let card = {
            id: $scope.$id,
            attack : $scope.attack,
            cost: $scope.cost,
            img: $scope.img,
            name: $scope.name,
            class: $scope.class,
            rarity: $scope.rarity,
            type: $scope.type
        }

        return $http({
            method: 'POST',
            url: '/card',
            data: card
        })
    };
}
angular.module('cardDirective').controller('CardDirectiveController', CardDirectiveController);

Server

'use strict';

let express = require('express'),
    path = require('path'),
    router = require('./routes/sampleRouter'),
    cardRouter = require('./routes/cardRouter');


let app = express();

// Serve any requests for static files (like index.html)
app.use(express.static(path.join(__dirname + '/public/')));

// Use any routing rules found in the router file
app.use('/', router);
app.use('/card', cardRouter)



app.listen(PORT, function() {
    console.log('Application live and running on port: ' + PORT);
});

Router:

'use strict';

let express = require('express'),
    cardController = require('./../controllers/cardController');

let router = express.Router();

router.route('/').post(cardController.postCard);
router.route('/:cardName').get(cardController.showCards);


module.exports = router;

Back End Controller

'use strict';

let cardController = {
    showCards: showCards,
    postCard: postCard
};

module.exports = cardController


function showCards(req, res) {
    console.log('showCards ', req.params.cardName);
    res.end()
}

function postCard(req, res) {
    console.log('postCard ', req.url, req.method, req.data)
    res.end()
}

The response I am getting in the console from making this request is postCard / POST undefined. Console logging the card object returns the expected result. I feel like I must be missing something obvious, but I've been stuck for a while now.

Upvotes: 0

Views: 816

Answers (2)

Atul Agrawal
Atul Agrawal

Reputation: 1520

Please use body-parser in your app.js file. Change your server.js file to following code

    'use strict';

    let express = require('express'),
        path = require('path'),
        router = require('./routes/sampleRouter'),
        cardRouter = require('./routes/cardRouter'),
        bodyParser = require('body-parser');




    let app = express();

    // Serve any requests for static files (like index.html)
    app.use(express.static(path.join(__dirname + '/public/')));
    // parse application/json
    app.use(bodyParser.json());

    // Use any routing rules found in the router file
    app.use('/', router);
    app.use('/card', cardRouter)



    app.listen(PORT, function() {
        console.log('Application live and running on port: ' + PORT);
    });

Upvotes: 0

alexmac
alexmac

Reputation: 19607

You need to use bodyParser middleware to parse request body.

Install the body-parser module:

$ npm install body-parser

Configure it in app.js :

var bodyParser = require('body-parser');

// parse application/json
app.use(bodyParser.json());

In your controller use req.body instead of req.data:

function postCard(req, res) {
   console.log('postCard ', req.url, req.method, req.body);
   res.end();
}

Upvotes: 2

Related Questions