Get Ember Data to accept different key pair - ember.js

My API works almost the way Ember wants it to, with one exception. All my JSON is under the namespace "data". Ember wants it to be under the namespace of the model, like "users". How can I tell ember to just use the "data" key?

What does your app/application/adapter.js file look like? Take a look at the Ember docs for customizing your endpoints. My guess is that it should look something like this for you:
import DS from 'ember-data';
export default DS.RESTAdapter.extend({
namespace: 'data'
});

You can intercept the initial response payload in adapter's handleResponse hook: http://emberjs.com/api/data/classes/DS.RESTAdapter.html#method_handleResponse
There you can overwrite the root of the payload with the one that Ember Data expects.

Related

Ember model host adapter not overiding mirage

I'm using Ember-cli-mirage to mock data. I want to slowly integrate parts of the production api which is located on my local machine at http://localhost:8000. Ember docs tell me that I should be able to set an adapter so I can have a different host for each model.
I have a customer model, and have setup ember-cli-mirage which is successfully serving data. The customer model is the first model I want to split out to localhost:8000.
I've setup adapters/customer.js with the following:
import DS from 'ember-data';
export default DS.RESTAdapter.extend( {
host: 'http://localhost:8000',
namespace: 'api/v1'
});
But when I make the call I'm getting an error:
Mirage: Error: Your Ember app tried to GET 'http://localhost:8000/api/v1/customers',
but there was no route defined to handle this request.
Define a route that matches this path in your
mirage/config.js file. Did you forget to add your namespace?
And my header inspector shows that customers is making the request to the mirage server:
Request URL:http://localhost:6543/customers
Request Method:GET
Status Code:304 Not Modified
Remote Address:[::1]:6543
I suspect it's something to do with my config/environment.js setup so I'm looking at a variation of https://github.com/samselikoff/ember-cli-mirage/issues/497#issuecomment-183458721 as a potential workaround. But I can't see why mirage won't accept the adapter overide.
Should have read back through the mirage docs for this one. There's a passthrough function that allows mirage to pass certain requests through to Ember bypassing mirage:
// mirage/config.js
import Mirage from 'ember-cli-mirage';
export default function() {
this.urlPrefix = 'http://localhost:8000';
this.namespace = '/api/v1';
// Requests for customers
this.get('/customers');
this.get('/customers/:id');
this.post('/customers');
this.del('/customers/:id');
this.patch('/customers/:id');
// Passthrough to Django API
this.passthrough('/customers');
}
To make this work in my application adapter I added:
// app/adapters/application.js
import DS from 'ember-data';
export default DS.RESTAdapter.extend({
host: 'http://localhost:8000',
namespace: 'api/v1'
});
If this helps you in any way feel free to give this answer an upvote :)

What RESTAdapter expects on server responses and what requests should server expect?

I'm using Django REST Framework, not Rails (which seems to have several magical gems to make everything work swiftly with Ember) and I've been having some difficulties trying to figure out how Ember expects responses. I'm using Ember CLI, thus I'm also using Ember data.
The documentation states only the typical GET usage, when I'm simply retrieving an object or an array of objects. Documentation states:
The JSON payload should be an object that contains the record inside a root property
And about conventions:
Attribute names in your JSON payload should be the camelCased versions of the attributes in your Ember.js models.
No problem with that.
1. But how should the API respond when there are errors?
Ok, so documentation also states you could use ajaxError to check jqXHR status for an error and then return a populated DS.Error for the record. However, how should I return different kind of errors. For example, let's say the user session is now invalid and because of that the server couldn't delete a record as requested.
2. How will Ember submit requests?
I'm quite new to REST in general. I think Ember simply use the appropriate verb for the action it wants: GET, POST, PUT, DELETE. I think it's quite clear it will send all the model's field to POST a new one, but how about DELETE? Will Ember send all the record or just the ID to delete an object?
Generally you should be able to see the requests Ember makes by just opening your browser dev tools and seeing the network requests.
Ember data likes the api to respond with an errors hash, something like this:
{"errors":{"title":["can't be blank"]}}
Then as long as you define a function to handle the error case:
Ember.Controller.extend({
actions: {
deleteUser: function() {
var user = this.model;
function success() {
// do something cool?
}
function failure() {
user.rollback();
}
user.destroyRecord().then(success, failure);
}
}
});
then user.errors will be automatically populated and you can do an if user.errors in your template.

Ember data post to Web API

How can I get my web api to understand the format returned by ember data?
ember data is sending like this:
{client: {firstName:"",lastName:""}}
As far as I understand web api is looking for
{firstName:"",lastName:""}
After so much googling I finally get the right terms and figured out how to do it. Simple serilizer update on the ember data side:
App.ApplicationSerializer = DS.RESTSerializer.extend({
serializeIntoHash: function (hash, type, record, options) {
Ember.merge(hash, this.serialize(record, options));
}
});

Ember data and RestAdapter

I'm building an ember application with a RESTAdapter to access my data in an api. I'm using the latest version of ember-data from https://github.com/emberjs/data/downloads.
This is how I'm declaring my RESTAdatpter-
App.ApplicationAdapter = DS.RESTAdapter.extend({
host: 'http://example.com'
});
but I dont think it's declared correctly as the ember inspector in the browser says that it cannot detect an adapter. Where am I going wrong?
I had the same issue and was able to get it to work using the following:
DS.RESTAdapter.reopen({
host: 'http://example.com'
})
I'm not sure if the guides need to be updated or if there's a different way to accomplish this.
It worked when I changed the ember data version to 1.0.0-beta.

Ember data 1.0.0 Beta: RESTAdapter endpoint customization no longer works

I am converting a project for use with Ember data 1.0.0 Beta 1 (just released). I have a REST adapter listening on a specific endpoint and thus need to customize the endpoint.
This is how it worked in Ember data 0.13:
App.Adapter = DS.RESTAdapter.extend({})
DS.RESTAdapter.reopen({
url: 'https://api.example.com'
});
In Ember data 0.13, the URL became: https://api.example.com/authors
In Ember data 1.0.0, the url becomes: http://192.168.0.108:51939/authors
with /192.168.0.108:51939 the url on which the webapp is running.
It thus looks like the url setting on .reopen of a RESTAdapter no longer works ?
I have the same problem with other customizations of the URL (such as namespace) ...
Hope somebody can help.
Marc
Looks like this was updated soon after #cyclomarc's answer (check the PR https://github.com/emberjs/data/pull/1145). In ember data 'url' is now 'host'. 'namespace' stills works.
DS.RESTAdapter.reopen({
host: 'http://google.com',
namespace: 'api'
});
Sends requests to http://google.com/api/*
Ember v1.0.0-7
Ember Data v1.0.0-beta.1-17
EDIT: This is now documented in TRANSITION.md:
https://github.com/emberjs/data/blob/master/TRANSITION.md#host-and-namespace-configuration
Ember-Data 1.0 beta is a complete rewrite of the API, see the transition guide, which details the changes made
The transition guide mentions that the Adapter API has changed, and adapters will have to be rebuilt. This is likely a breaking change, and the documentation is forthcoming on the endpoint customization
Seems to be a regression. A PR is registered by Paul Chavard.
See https://github.com/emberjs/data/pull/1145
In the meantime, overriding the buildUrl is a solution (see answer from #intuitivepixel)
https://github.com/emberjs/data/blob/master/TRANSITION.md
http://emberjs.com/guides/models/connecting-to-an-http-server/
App.ApplicationAdapter = DS.RESTAdapter.extend({
host: 'http://api.example.com',
namespace: 'admin'
})
Refer to the links above.
Note that with the current ember-data beta you must call your custom adapter "App.ApplicationAdapter".
Doesn't work if you try "App.Adapter".
Hope that helps!
It seems the RESTAdapter in beta1 has quite a few regressions. I'm looking at it now and so far I see missing:
namespace/url configuration
camelCase to lower_with_underscore attribute mapping
query params on GET url
Non of the above is mentioned in the transition guide (unless I completely missed it).
Having looked into the transition guide, still no mention about that url and namespace are removed from the RESTAdapter, further reading in the source code inline comments still refer it can be used as mentioned in the question. But as #cyclomarc mentioned in his comment (referring to what #tchak13 said that one should now use buildURL), so this is how you could do it overriding the buildURL function:
App.Adapter = DS.RESTAdapter.extend({
buildURL: function(type, id) {
var url = "/" + Ember.String.pluralize(type.typeKey);
if (id) { url += "/" + id; }
return 'https://api.example.com' + url;
}
});
Hope it helps.