mardi 7 juin 2016

Error connecting Ember client side to Node/ Mongo backend

I am building a web app that uses Ember for the client side and Node for the server side. The database I am using is Mongo. Everything is working on the server side (I am able to use Postman to GET, POST, PUT, and DELETE users. I think I almost have everything hooked up on the client side, but Ember is throwing me one final error when I navigate to the /users route:

ember.debug.js:28535 Error while processing route: users Assertion Failed: You must include an 'id' for user in an object passed to 'push' Error: Assertion Failed: You must include an 'id' for user in an object passed to 'push'

Any ideas why this is happening/ how to fix it?

Here are the relevant parts of my server.js file:

var User     = require('./models/user');

// configure app to use bodyParser()
// this will let us get the data from a POST
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

// Add CORS headers
app.use(function (request, response, next) {
    response.header("Access-Control-Allow-Origin", "http://localhost:4200");
    response.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    response.header("Access-Control-Allow-Resource", "*");
    response.header("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE");
    next();
});

var port = process.env.PORT || 8080;        // set our port

// ROUTES FOR OUR API

var router = express.Router();              // get an instance of the express Router

// test route to make sure everything is working (accessed at GET http://localhost:8080/api)
router.get('/', function(request, response) {
    response.json({ message: 'hooray! welcome to our api!' });   
});

// more routes for our API will happen here

// REGISTER OUR ROUTES
// all of our routes will be prefixed with /api/v1
app.use('/api/v1/', router);

// START THE SERVER
app.listen(port);
console.log('Magic happens on port ' + port);


// more routes for our API will happen here

// on routes that end in /users
// ----------------------------------------------------
router.route('/users')

    // create a user (accessed at POST http://localhost:8080/api/v1/users)
    .post(function(request, response) {

        var user = new User();      // create a new instance of the User model
        user.name = request.body.name;  // set the user's name (comes from the request)
        user.email = request.body.email; // set the users's email property 
        user.password = request.body.password; //set the user's password property

        // save the user and check for errors
        user.save(function(error) {
            if (error)
                response.send(error);

            response.json({ message: 'User created!' });
        });
    })

    // get all the users (accessed at GET http://localhost:8080/api/v1/users)
    .get(function (request, response) {
        User.find(function (error, users) {
            if (error) response.send(error);
            response.json(users);
        });
    });

// on routes that end in /users/:user_id
// ----------------------------------------------------
router.route('/users/:user_id')

    // get the user with that id (accessed at GET http://localhost:8080/api/users/:user_id)
    .get(function (request, response) {
        User.findById(request.params.user_id, function (error, user) {
            if (error) response.send(error);
            response.json(user);
        });
    })

    // update the user with this id (accessed at PUT http://localhost:8080/api/users/:user_id)
    .put(function (request, response) {

        // use our user model to find the user we want
        User.findById(request.params.user_id, function(error, user) {
            if (error) response.send(error);

            // update the user info
            user.name = request.body.name;
            user.email = request.body.email;
            user.password = request.body.password;

            // save the user
            user.save(function(error) {
                if (error) response.send(error);
                response.json({ message: 'User updated!' });
            });
        });
    })

    // delete the user with this id (accessed at DELETE http://localhost:8080/api/users/:user_id)
    .delete(function (request, response) {
        User.remove({
            _id: request.params.user_id
        }, function(error, user) {
            if (error) res.send(err);

            response.json({ message: 'Successfully deleted' });
        });
    });

Here is my application adapter (on the Ember side):

import DS from 'ember-data';

export default DS.RESTAdapter.extend({
    host: 'http://localhost:8080',
    namespace: 'api/v1'
});

Here is my serializer (on the Ember side):

import JSONAPISerializer from 'ember-data/serializers/json-api';
import DS from 'ember-data';

export default JSONAPISerializer.extend({
    primaryKey: '_id'
});

export default DS.JSONSerializer;

Here is my model (on the Ember side):

import Model from 'ember-data/model';
import attr from 'ember-data/attr';

export default Model.extend({
  name: attr('string'),
  email: attr('string'),
  password: attr('string')
});

Here is my users.js route (on the Ember side):

import Ember from 'ember';

export default Ember.Route.extend({
    model() {
        return this.store.findAll('user');
    },
    actions: {
        createUser(newName, newEmail, newPassword) {
           this.store.createRecord('user', {
               name: newName,
               email: newEmail,
               password: newPassword
           }).save();
        },
        updateUser(user) {
            user.save();
        },
        deleteUser(user) {
            user.destroyRecord();
        }
    }
});




Aucun commentaire:

Enregistrer un commentaire