Fehler beim Verbinden der Ember-Clientseite mit dem Knoten/Mongo-Backend

Question

Ich erstelle eine Webanwendung, die Ember für die Clientseite und Node für die Serverseite verwendet. Die Datenbank, die ich verwende, ist Mongo. Alles funktioniert auf der Server-Seite (Ich kann Postman zu GET, POST, PUT und DELETE verwenden. Ich denke, ich habe fast alles auf der Client-Seite angeschlossen, aber Ember wirft mir einen letzten Fehler, wenn ich zu navigieren die/Benutzer 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' 

Irgendwelche Ideen, warum dies geschieht/wie man es beheben

Hier sind die relevanten Teile meiner server.js Datei:

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' }); 
     }); 
    }); 

Hier ist mein Anwendungsadapter (auf der Ember-Seite):

import DS from 'ember-data'; 

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

Hier ist mein Serializer (auf der Seite Ember):

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

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

export default DS.JSONSerializer; 

Hier mein Modell ist (auf der Ember Seite):

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') 
}); 

Hier meine users.js Route ist (auf der Emberseite):

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(); 
     } 
    } 
}); 

Answer 1

Aus Ihrem geposteten Code ist Ihr Application Adapter als RESTAd definiert apter und Ihr Serializer ist als JSONAPISerializer definiert. Ember erwartet JSON API-Format wie auf jsonapi ORG-Site definiert

Um zu lösen, können Sie zwei Dinge tun. Stellen Sie das JSON-API-Format des Knotens mit der Daten-ID und dem Attributformat unter Verwendung dieser Bibliothek her, zum Beispiel: https://github.com/SeyZ/jsonapi-serializer oder stellen Sie sicher, dass Sie REST-Serializer und -Adapter für Ihre Ressourcen verwenden.

Versuchen Sie, Ihre Anwendung Serializer wie diese

import DS from 'ember-data'; 
export default DS.RESTSerializer.extend({ 
    primaryKey: '_id', 
    serializeId: function(id) { 
    return id.toString(); 
    } 
}); 

Stellen Sie sicher, zu definieren, dass JSON Ausgabe etwas wie folgt umfassen:

{ 
    users: [ 
     {"_id": "13ac3f0d4e29d794d9f62898","name":"", "email": "" }, 
     {"_id": "13ac3f0d4e29d794d9f62899","name":"", "email": "" } 
    ] 
} 

Ein weiteres kleines Problem ist, dass Ihr API-Endpunkt auf Server-Seite, die erstellt, Löscht oder aktualisiert die Benutzerrückmeldung anstelle der Benutzerressource

Sie sollten immer die aktualisierte Ressource zurückgeben. In diesem Fall müssen Sie den Benutzer wie in GET/Benutzer/ID route mit korrektem Status und Fehlercode zurückgeben, zum Beispiel:

Beim Erstellen eines Benutzers ember würde erwarten dass Sie 201 CREATED-Statuscode und JSON-Antwort der Benutzerressource zurückgeben. Für DELETE und PATCH/PUT (Update) müssen Sie den Statuscode 200 zurückgeben. In allen Fällen müssen Sie response.json (user) verwenden, anstatt Nachrichten auszugeben.

Wenn Sie die Anfrage nicht bearbeiten können (z. B. wenn eine Benutzer-E-Mail bereits erstellt wurde), sollten Sie mit 422 antworten und die entsprechende Fehlermeldung zurückgeben. Sehen Sie dies für die Handhabung von Fehlern: http://emberjs.com/api/data/classes/DS.Errors.html

Ich hoffe, es hilft.