Permissions/ACL in a JavaScript Client Side App

Question

If I have a JavaScript front end application, what is the best/common practice to handle permissions/ACL. For example, I want to show/hide some elements etc. Of course, its not secure, but still on the view layer, how can I control this.

I am using BackboneJS (with Marionette) as a client side framework, so using jQuery, Underscore etc.

I am thinking on the high level, I can try to somehow disable some routes. Needs some research but I could do Router.on("route", checkPermissions).

Then on the view layer, to hide/show elements, ... still not sure how best to handle this. I need to pass in a some permissions object into the model ...

Peephole

Answer 1

I'd create custom BaseModel/BaseCollection classes with modified parse logic that would remove unaccessible attributes from data layer. Later on you would be able to transfer this data concealment logic to server side transparently and get production-worth security.

As for permission data, _security attribute on Model/Collection classes would be a good place to declare it.

In views, use conditional logic as akoskm suggested

Nosewheel

Parsing out sensitive data attributes on the client side is a bad idea. Sensitive data should never even leave the server if the user does not have permission to see it. – Broddie

Answer 2

To make elements hidden/visible on the screen I do inline checks in my template, something like:

<% if (user.isInRole('ADMIN', 'MNGR')) { %>
    <li <% page == "store" ? print('class="active"') :'' %>>
    </li>
<% } %>

and added the following helper function inside my user model to check for the permissions:

isInRole: function (rr) {
    var self = this;
    $.each(rr, function(i) {
        if (rr[i] === self.currentRole) {
            alert('pass');
        }
    });
}

I assume this is secure-enough, since the actual check for required permission happens again on the server side. By hiding some controls I'm just guiding the user through the application and not letting him to be confused him with actions for he/she doesn't have the required privileges.

With such approach, I'm never hiding data which dynamically comes through the REST services, only static element of the page.

Phthisic