I am wondering if it's a good practice to use the same URL to provide both the HTML and JSON response.
For example if I am building a blog and I have a URL that provides the latest items, I would have a URL like /latest
I would like to use the same URL for my endpoint in angular to retrieve the items so I have following route in my node implementation:
app.get("/latest",function(req,res){
var type = req.header("Accept");
if(type.indexOf("application/json") > -1){
getLatestItems(req,res);
}
else {
res.render("/latest", {user: req.session.username, current: "latest"});
}
});
I was wondering if this approach is OK or is it better to have a separate set of endpoints for my JSON responses?
I would create a separate URL pattern for your backing API.
So in Angular you can still have a URL route /latest, but you will provide the JSON data via a URL like /api/latest.
This will create less confusion and also allow you to easily integrate the API with other stuff since it will only be returning JSON.
Related
I want to implement pagination in my "angularJs" application. I have a dropdown menu that I'm using angular-ui for that. I want at first application loads the first set of data from "API" and when scrolled to button with the help of ngInfiniteScroll requests the next set of data from the "API". For example at first in request "URL" I add "page=1" as parameter and for any request I add to that "page" number.
My question is that for this pagination should the "API" has the pagination capability or I can do this for any "API"?
If the "API" need to have that capability, do you know any "API" with pagination capability so I can test my application?
Appreciate any help.
my code is here
The API has to support pagination in the sense that it should be able to respond to queries with fragments of data, instead of dumping all the data in one go.
For example:
For page 1:
your.api.endpoint/your/resource/path/countries?offset=0&pageSize=50
For page 4:
your.api.endpoint/your/resource/path/countries?offset=200&pageSize=50
You can build your URL params for pagination however you want though, e.g. /countries?pageNo=4&pageSize=50, /countries?from=200&to=250 etc.
Note:
When you implement server-side pagination, you need to implement server-side sorting and filtering too; that's because with server-side pagination the client can only see 1 page of data and therefore sorting or filtering would be inaccurate.
EDIT to show example of mocking API response
In your service you might have something like this:
return $http({
method: 'GET',
url: 'your.api.endpoint/your/resource/path/countries?offset=200&pageSize=50'
})
And you'd replace it with:
var pageOfData = { ... }; // Mocked data here.
return $q(function (resolve, reject) {
resolve(pageOfData);
});
I just started learning MEAN and creating my first project using it.
I am implementing MVC model with Node JS and Express and it works great.
The problem is that I have several callers for methods with the same data - from API, directly in web, and from angular in web and mobile. And they expect different data format - some pure HTML while others JSON.
The question is how to correctly organize methods?
With code duplication:
Function A () ( return rendered html )
Function AfromAPIorAJAX () ( return JSON )
Or maybe have extra parameter FORMAT and use it in router:
Function A (format) ( if format == HTML return HTML else return JSON )
Or try to identify caller accept type via XHR (not sure if it will work for API)?:
Function A () ( if req.xhr return JSON else return HTML )
What can you recommend?
How you organize the methods in the big MEAN projects?
Thanks.
UPDATE: Real world example:
I have model Article. Its controller have methods: create, list, delete etc.
I want to have page on website with route "/articles" that list all recent articles. That page must also have categories filter block - that if clicked it update articles list via AngularJS for articles from that category (of course this all can be done with angular only, but I want a page with default articles available and easily be indexed by google, and use angular just to update articles on the fly).
I want also to have route "/api/articles" that will return list of articles in JSON format for GET request (this route btw maybe also used by angular js filter above).
So the question how many methods I need to create for this purpose in Article controller - "list" and "renderList", or just "list(format)", or "list" that will look for xhr (again dunno if API clients send xhr), or any other yours variant?
Okay guys, looks like current stackoverflow community is useless, but i found the response to my question in previous posts here: in express.js, any way to capture request to both json and html in one function?
I am using backbone with Node and Express. I have my restful api set up to return my model and collection data. The api works fine. But I'm having trouble binding a route to one of my api paths.
I have a company model and collection so that when go to the routes you get the restful api data for that route:
http://localhost:3000/employees you get the data for restful api path api/employees
http://localhost:3000/employees/1 you get the data for restful api path api/employees/1
I also have a category model and collection to do the same:
http://localhost:3000/categories you get the data for restful api path api/categories
but the following does not work:
http://localhost:3000/categories/Auto you don't get the data for restful api path api/cateogries/Auto The restful api works and returns the right data, but the collection I get in my app returns the same data as the category collection called with the path api/cateogries. Almost like the path gets ignored.
Typically you have a collection and then you provide a id attribute to get a model that belongs to that collection. But what if you want a collection whose id attribute returns another collection? For example, you get a list of categories and then when you select a category you get a list of all the companies in that category? What is the right way to do this in backbone?
Thanks. I actually figured it out. I was returning a collection and needed to adust the url of my collection to point it to the correct path in my restful api. So in my collection I added a url function that goes to a different route if a parameter is passed into the constructor:
url:function(){
if(this.category1){
return "api/categories/"+this.category1;
}
return "api/categories";
},
initialize:function(opts){
this.category1=opts && opts.category1;
}
I'm using AngularJS to integrate with a REST service which has already been built.
The REST API uses the following form for queries:
http://the.site/person/search/smith%20male (this searches for people called smith who are male)
I'm aware that this form isn't the best and will be ultimately getting the API changed to use a URL parameter.
Currently I'm just defining a resource inside my controller:
$scope.Summary = $resource("http://the.site/person/search");
this.Summary.query({ terms : 'smith male' });
but that generates URL's of the form /person/Search?terms=smith%20male
Is there a way to modify or override the URL used? I'm more familiar with Backbone where I was able to provide a url() function in my which generated the correct form of URL.
$scope.Summary = $resource("http://the.site/person/search/:terms");
this.Summary.query({ terms : 'smith male' });
All,
I have a JsonStore backing a form panel in my extjs app. I want to have the jsonStore load a single record based on an id value, but haven't found a good way to do that yet, and still keep the url restful.
My first attempt was to add a param to the jsonstore load() method with the id in it. That only adds the id as a request param, not attached to the url:
http://my-app/users/?id=123
instead of what i want:
http://my-app/users/123
Can someone help me out with this?
You can manually construct the URL that the store uses to query for data (via the implicit HttpProxy it creates for the URL). So your loading function would look like:
function store_refresh() {
json_store.proxy.conn.url = 'http://my-app/users/' + user_id;
json_store.reload();
}