Serializers-Sending Data to the Server with Serialize
Published on May 20, 2016
Ember Data Serializers aren’t just for getting data from the server- they’re also for sending data back. This tutorial explores the serialize method and how it works with the methods serializeAttributes, serializeBelongsTo, serializeHasMany, and serializeIntoHash.
Links
- serialize API documentation (scroll down for the other methods we discuss)
Code
import DS from 'ember-data';
export default DS.JSONAPISerializer.extend({
serialize(snapshot, options){
console.log('start serialize', snapshot)
var oldSerialization = this._super(...arguments)
console.log('finish serialize', oldSerialization)
return oldSerialization
},
serializeAttribute(snapshot, json, key, attribute){
console.log('serializeAttribute', snapshot, json, key, attribute);
var oldSerialization = this._super(...arguments)
console.log('done serializeAttribute', snapshot, json, key, attribute);
return oldSerialization;
},
serializeBelongsTo(snapshot, json, relationship){
console.log('serializeBelongsTo', snapshot, json, relationship);
return this._super(...arguments);
},
serializeHasMany(snapshot, json, relationship){
console.log('serializeHasMany', snapshot, json, relationship);
return this._super(...arguments);
},
serializeIntoHash(hash, typeClass, snapshot, options){
console.log('serializeIntoHash', hash, typeClass, snapshot, options)
var oldSerialization = this._super(...arguments);
console.log('done serializeIntoHash', hash, typeClass, snapshot, options)
return oldSerialization
},
})
Transcript
Hey and welcome back to our series on Ember Data 2.0 Serializers. Now in the past in this series, we focused on when something comes in to the app, what will we do with that JSON, and that’s called deserialization. And so that involves extracting stuff and normalizing stuff. And what we’re going to talk about now is how to serialize the data, so when we’re packaging it up to send it to the server, how does that work. And we’re going to go over the basic serialize
method and well as the suite of serialize methods that do specific things for attributes, belongsTo
relationships, and hasMany
relationships, and the wrapper serializeIntoHash
method. Let’s get started.
So first, we’ll go to the serialize
method. We’ll see that it takes in a snapshot and a set of options, and then it returns a json
hash. So let’s go ahead and here in our base
serializer I’ve created this, and we’re not changing anything. We’re just seeing what is already changed by the default. So we’re going to print out the snapshot
, and then we’re going to print out what is returned by the super
call to serialize
.
So here when I hit save, we can see that at the start of the serialization call we get the snapshot, and it has some attributes and it has some relationships, in this case this quote has a book, and then at the end we have an object which has attributes
but not underscored. And the attribute has been changed based on the keyFor
methods that we did last time. And then it has a relationship which has been changed by the keyFor
relationship method.
So how does the serialize
method work with the serializeAttribute
, serializeBelongsTo
, and serializeHasMany
methods? Let’s go ahead and log out when those are being done. And so when we click save, we’ll see that we’ll start the serialize
method. And then we’ll call the serializeAttribute
and serializeBelongsTo
methods, and then after that we’ll finish the serialize
method. So serializeAttribute
and serializeBelongsTo
, as well as serializeHasMany
which there’s no hasMany
relationship on this model, those are all called in between when the serialize
method starts and when it ends.
So those are getting called when you’re calling super
here. So this gives you some options if you want to change something. You could of course do it before you call super
, but I think that’s the least likely candidate for where to change things. You could do it after you call super
, and that lets you get everything that’s been done in things like keyFor
, things that are already going to change the serialization, and then lets you add your changes on top of those. And then you could do it within the specific methods. This is most likely the place where you’ll want to do that.
So let’s take a quick look at what’s happening inside one of these specific methods. We’re going to do serializeAttribute
, although serializeBelongsTo
and serializeHasMany
work in a similar way. So what we’re going to do is log out what we have at the start, and then we’re going to call super
and log out what’s changed here and then return the result. So the key that we really want to be paying attention to is json
.
So we’ll see that here we have our serializeAttribute
and what we get after we’ve already called super
within serializeAttribute
. And notice how different these jsons are. So the first one just has an id of 3. The second one has an id of 3 and an attributes hash. And ignore this relationships hash for now. What happened is this object’s been updated because of what’s changed down here, and so it’s been updated within the console. If we put a debugger
statement here, we’ll see that when it stops, it does not actually have... here it is... it does not have the relationships, just the attribute. So when you’re debugging this, that’s something to be aware of. The objects in the console sometimes get updated with the information past where you are. So this console.log
runs before the belongsTo
, but the json
, because of how JavaScript works, is updated by the serializeBelongsTo
.
So with that little complication out of the way, lets return to looking at the different serialize methods. So serializeBelongsTo
and serializeHasMany
work in a very similar way to serializeAttribute
. But what about serializeIntoHash
? What does that do? Let’s go ahead and see what happens. So when we click ‘save’ now, we’ll notice that serializeIntoHash
is what’s called first and then everything else is called in between and then it finishes serializing the hash. And we’ll notice what’s changed, the first object that’s passed in the hash, at the start it’s just an empty object, but by the end it ends up having all the data that we’re going to end up passing to the server. So serializeIntoHash
is what wraps everything else.
So that should give you some insight into the serialize set of methods on the JSONAPISerializer. So serializeIntoHash
wraps serialize
, and serialize
wraps several instances of serializeAttribute
, serializeBelongsTo
, and serializeHasMany
. If you’re using something besides JSONAPISerializer, let’s say you’re using the RESTSerializer, you’ll notice that not only does it have the same methods, but they work in pretty much the same way as far as I know. I haven’t explored this extensively. But what you’ve learned in this episode should help you tackle your serialization no matter what serializer you choose to use. And if you’ve been keeping up with these live as they’re released, this is going to be the last episode in the serializer series for a while. So I hope you enjoyed it and I’ll see you next week when we have new, exciting stuff to tackle. I’ll see you then.