Writing JS code to mimic api design

Question

We're planning on rebuilding our service at my workplace, creating a RESTful API and such and I happened to stumble on an interesting question: can I make my JS code in a way that it mimics my API design?

Here's an example to illustrate what I mean:

We have dogs, and you can access those dogs doing a GET /dogs, and get info on a specific one by GET /dogs/{id}.

My Javascript code would then be something like

var api = {
    dogs : function(dogId) {
        if ( dogId === undefined ) {
            //request /dogs from server
        } else {
            //request /dogs/dogId from server
        }
    }
}

All if fine and dandy with that code, I just have to call api.dogs() or api.dogs(123) and I'll get the info I want.

Now, let's say those dogs have a list of diseases (or whatever, really) which you can fetch via GET /dogs/{id}/disases. Is there a way to modify my Javascript so that the previous calls will remain the same - api.dogs() returns all dogs and api.dogs(123) returns dog 123's info - while allowing me to do something like api.dogs(123).diseases() to list dog 123's diseases?

The simplest way I thought of doing it is by having my methods actually build queries instead of retrieving the data and a get or run method to actually run those queries and fetch the data.

The only way I can think of building something like this is if I could somehow, when executing a function, if some other function is chained to the object, but I don't know if that's possible.

What are your thoughts on this?

Something like this - http://stackoverflow.com/questions/18218007/generating-a-js-client-based-on-a-asp-net-webapi-controller ? — Russ Cam, Apr 24 '14 at 20:55
Russ, that's not really it. That answer only seems to provide one level deep api calls, like my `api.dog()`, but wouldn't allow me to do `api.dog(123).diseases()`. I'm not sure if I've made myself clear enough =/ — Felipe Ruiz, Apr 24 '14 at 21:09
Does it have to be that exact syntax or would something like `api.dog(123).diseases().execute()` be acceptable? The equivalent for retrieving a list of dogs could be `api.dog().execute()` — Dan, Apr 24 '14 at 22:05
@Dan I wouldn't have a problem with that syntax, it would actually make things easier when doing a `POST`or `DELETE` or whatever, but I'm really curious about that exact syntax — Felipe Ruiz, Apr 25 '14 at 01:37
Then I don't see a way to achieve this. The method dog would have to know if there is anything to be called on its return value and in that case not perform the search and return the builder. Just as you wrote above. I don't think that's possible though. — Dan, Apr 25 '14 at 16:40

SeDav · Answer 1 · 2014-04-24T21:41:55.393

0

I cannot give you a concrete implementation, but a few hints how you could accomplish what you want. It would be interesting to know, what kind of Server and framework you are using.

Generate (Write yourself or autogenerate from code) a WADL describing your Service and then try do generate the Code for example with XSLT
In my REST projects I use swagger, that analyzes some common Java REST Implementation and generates JSON descriptions, that you could use as a base for Your JavaScript API

It can be easy for simple REST Apis but gets complicated as the API divides into complex hierarchies or has a tree structure. Then everything will depend on an exact documentation of your service.

edited Apr 24 '14 at 21:41

answered Apr 24 '14 at 21:18

SeDav

761
7
19

We're currently on a LAMP stack, but I don't see how the back-end would change my front-end implementation. Also, I couldn't quite make the jump from what you said to what I thought of, could you elaborate a bit more? – Felipe Ruiz Apr 25 '14 at 01:35
Your question seemed like you want an JS API that automatically generates some Object structure with functions, which ease the use of your REST Api. I just stated some ideas how this could be achieved. Of course you can write these methods on your own, but it would be really cool if the api would "update" itself or even generate the methods on the fly, as you receive the response. But this definitely depends on the specific demands and the structure of your REST API. – SeDav Apr 28 '14 at 17:15

score 0 · Answer 2 · answered Apr 24 '14 at 21:56

Assuming that your JS application knows of the services provided by your REST API i.e send a JSON or XML file describing the services, you could do the following:

var API = (function(){
    // private members, here you hide the API's functionality from the outside.

    var sendRequest = function (url){ return {} }; // send GET request

    return {
        // public members, here you place methods that will be exposed to the public.

        var getDog = function (id, criteria) {
            // check that criteria isn't an invalid request. Remember the JSON file?
            // Generate url
            response = sendRequest(url);
            return response;
        };
    };
}());

var diseases = API.getDog("123", "diseases");
var breed = API.getDog("123", "breed");

The code above isn't 100% correct since you still have to deal with AJAX call but it is more or less what you what.

I hope this helps!

That is one way of doing it, yes, but if you use the request as a string, like you did with `diseases` and `breed`, you lose auto-completion. Then you'd have to keep looking up some kind of documentation to find which methods are allowed and which aren't — Felipe Ruiz, Apr 25 '14 at 01:11
Yeah I know, that's why I said it isn't 100% correct. I am good at making JS APIs but that is as far as it goes. — , Apr 28 '14 at 03:16

Writing JS code to mimic api design

2 Answers2