I'm new to Ember and from what I understand it has a very specific way it excepts its json api response to look like. Like so:
{
"post": {
"id": 1,
"title": "Node is not omakase",
"comments": [1, 2, 3]
},
"comments": [{
"id": 1,
"body": "But is it _lightweight_ omakase?"
},
{
"id": 2,
"body": "I for one welcome our new omakase overlords"
},
{
"id": 3,
"body": "Put me on the fast track to a delicious dinner"
}]
}
Now the api I've already built has an json response that looks like so:
{
"data": {
"id": 1,
"name": "Pansy Bednar",
"links": [
{
"rel": "self",
"uri": "/pansy-bednar15"
}
],
"players": {
"data": [
{
"id": 2,
"name": "Nicholas O'Reilly",
"position": "cad",
"age": 23,
"value": "640",
"links": [
{
"rel": "self",
"uri": "/team/nicholas-o-reilly71"
}
]
}
]
}
}
}
The api is pretty big and is working fine with the mobile app. So a code re write would be to costly I would just choose another js framework even though I like Ember the best.
So my question is is there any way I can adapt the expected json response in ember. If yes how hard is it? Worth the time or should I just go for Angular or Aurelia.
or am I completely wrong and there is no one expected response to ember?
The thing you can do with ember is to write your very own adapter for this there are already many questions+answers out there:
https://stackoverflow.com/a/17938593/1581725
https://stackoverflow.com/a/24411550/1581725
...
And there is also this blog entry here: http://eviltrout.com/2013/03/23/ember-without-data.html it's about using ember without ember-data.
Found this little gem called normalizePayload - maybe this would also work for your case: https://stackoverflow.com/a/21790093/1581725
Related
Ember uses Restadapter & Jsonapiadapter for the adapters.
What are the exact differences between the 2 in terms of data formats for request/response ?
Any other things we need to ensure when using any of these 2.
The JSONAPIAdapter conforms to the JSONApi spec
Use RESTAdapter when you have an JSON API that follows a REST endpoint with pluralized object names and has a root node using the name of the object being returned.
Examples below:
Example JSONAPI spec object:
{
"data": [{
"type": "articles",
"id": "1",
"attributes": {
"title": "JSON API paints my bikeshed!"
},
"relationships": {
"author": {
"links": {
"self": "http://example.com/articles/1/relationships/author",
"related": "http://example.com/articles/1/author"
},
"data": { "type": "people", "id": "7" }
}
},
}],
"included": [{
"type": "people",
"id": "7",
"attributes": {
"name": "Dave",
"twitter": "kiwiupover"
}
}]
}
Example Rest json api object:
{
"posts": {
"id": 5,
"title": "An API that gets bikeshed for months ",
"author": "kiwiupover",
"comments": [1]
},
"comments": [{
"id": 1,
"name": "Dave",
}]
}
Ember Data provides straightforward methods for adapting your DS.adapter to your specific JSON API shape.
There is a third adapter from which the previously mentioned adapters are extended from.
I've done Dan Abramov's intro series on EggHead, and am working on a real world app. The domain is complex, so I'll run with a classic "blogs" example.
Let's say, we have an "index / list" page, where all we need to show are the blog post's title and blurb. So we have an API endpoint that returns that, and we store it in our state tree under blogs.byId.
Then, when you click through on a blog post, we actually need a bunch more info - e.g. the full blog post, and also tags and categories. Let's call this "blogs with metadata".
Stretching the example, there might be another completely separate page where I want to display a list of blog posts with the most recent 3 comments. Let's call this "blogs with comments".
My question is, how should my state tree treat these separate examples where I'm storing the same "thing" but in different "formats"? My initial hunch would be to treat them as completely separate data types, so my state tree would have eg: blogs.byId, blogsWithMetadata.byId and blogsWithComments.byId.
And then, even if every single blog post is cached in the blogs.byId section, the minute we need to view a blog post, the app completely ignores that warm blogs.byId cache, and looks only at blogsWithMetadata.byId - so we'd essentially be building up 3 separate caches of blog data, each with different amounts of info, and treating it as though they are as unrelated to each other as "blogs" and a completely unrelated table like "widgets" would be.
Is this correct? Or is there a better way?
The app currently rams them all under the same node, without distinction based on "format" and it's causing a world of pain.
There are probably many ways you could choose to do this. One of it is to use normalizr to structure your data.
Your blog post could have a data structure returned by the API like this:
{
"id": "123",
"author": {
"id": "1",
"name": "Paul"
},
"title": "My awesome blog post",
"comments": [{
"id": "324",
"commenter": {
"id": "2",
"name": "Nicole"
}
}],
"tags": [{
"id": "1",
"value": "awesome"
}, {
"id": "2",
"value": "journal"
}],
"categories": [{
"id": "1",
"value": "personal"
}, {
"id": "2",
"value": "life"
}]
}
which after normalizing, will look something like this:
{
entities: {
"post": {
"123": {
id: "123",
author: "1",
title: "My awesome blog post",
comments: ["324"],
tags: ["1", "2"],
categories: ["1", "2"],
}
},
"users": {
"1": { "id": "1", "name": "Paul" },
"2": { "id": "2", "name": "Nicole" }
},
"comments": {
"324": { id: "324", "commenter": "2" }
}
"tags": {
"1": { id: "1", "value": "awesome" },
"2": { id: "2", "value": "journal" },
}
"categories": {
"1": { id: "1", "value": "personal" },
"2": { id: "2", "value": "life" },
}
}
}
Subsequently, you could have a state for each page if you needed to:
{
entities: {...},
ui: {
blogs: {
posts: [1, 2],
hasComments: false,
// Displaying the blogs with or without comments
// could simply just be a boolean flag in state.
},
}
}
using reselect, you then create the selectors to pass the posts you want as props to the page Components.
Question:
Is there a plain or native javascript way to validate a JSON script against a JSON schema?
I have found lots of libraries on Github, but no native/plain solution. Does EcmaScript not have a specification for this? and do none of the browsers (or nodejs) have a way to validate JSON natively?
Context of Question:
I have a very complex schema that I developed.
It is supposed to work along with a script that requires that the JSON data passed into it to comply with the schema.
Simply, no.
There was something called JSON Schema, which was an Internet Draft which expired in 2013. Internet Drafts are the first stage to producing an Internet Standard. See more about it at the official site, as it seems to potentially still be actively developed, although it is not (to my knowledge) in widespread use.
An example of the schema:
{
"$schema": "http://json-schema.org/schema#",
"title": "Product",
"type": "object",
"required": ["id", "name", "price"],
"properties": {
"id": {
"type": "number",
"description": "Product identifier"
},
"name": {
"type": "string",
"description": "Name of the product"
},
"price": {
"type": "number",
"minimum": 0
},
"tags": {
"type": "array",
"items": {
"type": "string"
}
},
"stock": {
"type": "object",
"properties": {
"warehouse": {
"type": "number"
},
"retail": {
"type": "number"
}
}
}
}
}
will validate this example JSON:
{
"id": 1,
"name": "Foo",
"price": 123,
"tags": [
"Bar",
"Eek"
],
"stock": {
"warehouse": 300,
"retail": 20
}
}
There seems to be at least one pure JS solution now (https://github.com/tdegrunt/jsonschema) available via npm (https://www.npmjs.com/package/jsonschema). I am not a contributor, although I appreciate their work.
I've tried 100 different things, and spend days looking through Google and Stackoverflow, but I can't find a solution to this problem. Everything I call after the body of this API response returns undefined!
The response from Facebook SDK looks like this:
[
{
"body": "[
"data": [
{
"name": "Larry Syid Wright",
"administrator": false,
"id": "xxx"
}, {
"name": "Melissa Long Jackson",
"administrator": false,
"id": "xxx"
}, {
"name": "Charlotte Masson",
"administrator": false,
"id": "xxx"
}
],
"paging": {
"next": "url"
}
]"
},{
"body": "{
"data": [
{
"id": "xxx_xxx",
"message": "In honor of Halloween, how many of you have your own ghost stories? Who believes in ghosts and who doesn't?",
"type": "status",
"created_time": "2014-10-31T20:02:01+0000",
"updated_time": "2014-11-01T02:52:51+0000",
"likes": {
"data": [
{
"id": "xxx",
"name": "Joe HerBatman Owenby Jr."
}
],
}
"paging": {
"cursors":
{
"after": "xxx",
"before": "xxx"
}
}
}
},{
"id": "xxx_xxx",
"from": {
"id": "xxx",
"name": "Jessica Starling"
},
"message": "Watching the "Campaign" and I can't help but notice what a fantastic job they did (Will ferrell and all) with that North Carolina accent! Ya'll know we sound different than other southern states ;)",
"type": "status",
"created_time": "2014-11-01T02:36:21+0000",
"updated_time": "2014-11-01T02:36:21+0000",
"likes": {
"data": [
{
"id": "xxx",
"name": "Scott Williams"n
}
]
}
}
],
"paging": {
"previous": "xxx",
"next": "xxx"
}
}"
}
]
This response is from a batch call. If I call them separately, I can easily iterate through the responses, and get everything from them. When I call them in the batch though, I can't get past "body", and I need to use a batch call.
console.log(response[0].body); will return the object inside the body of the first part of the response, but console.log(response[0].body.data); returns undefined. I just don't get it. This should be simple but it's like there's a lock on the door and I don't have the right key.
I normally have no issue iterating through objects, so I don't need a generalized answer. I need help seeing whatever it is here that I don't see. Why does the console show undefined when I call anything after the body, and what do I need to be doing to get any of these values?
That JSON contains nested JSON. body seems to be a string. Use
var body = JSON.parse(response[0].body);
The values from the body are just strings.which are embedded as json.So firstly you would need to parse them using JSON.parse.
The code would be like
var body = JSON.parse(response[0].body);
My code used to work, but now I am not able to publish any actions. Everything seems to be in order but the response I get from Facebook is a JSON list of the last 25 actions I took. I know my action isn't published because I'm watching it live in a browser. I'm also trying to post these actions with a browser.
Here is my code:
https://graph.facebook.com/me/NAMESPACE:ACTION?OBJECT=http://www.example.com/pumpkinpie.html&access_token=TOKEN
The response is 25 of these:
{
"data": [
{
"id": ""****"",
"from": {
"id": ""****"",
"name": "****"
},
"start_time": "2012-05-05T04:56:38+0000",
"end_time": "2012-05-05T04:56:38+0000",
"publish_time": "2012-05-05T04:56:38+0000",
"application": {
"id": ""****"",
"name": ""****"
},
"data": {
"website": {
"id": ""****"",
"url": "****",
"type": "website",
"title": "****"
}
},
"likes": {
"count": 0
},
"comments": {
"count": 0
}
},
of course the ** are actual values...
You cannot do HTTP POST for actions in a browser, only HTTP GET, which is why you receive the list of previous actions.
Please use cURL or the Graph API Explorer to accomplish creating an action.