Geek Answers Handbook

Security and localization with Angular in a single page application?

I am exploring the creation of single page applications using the following stack (offers can be opened here)

  • Angular
  • JQuery
  • ASP.Net MVC 4
  • Entity Framework 5

I pretty much sell this stack and angular, but there are a few things that I'm not sure about. Different users have different roles, and we will need to hide / show certain pages and / or controls on the pages depending on the role. I am familiar with some solutions for more traditional web applications, but I'm not sure where I will start when it comes to a single page application.

I was hoping not to use partial MVC views, but rather to send and process server code as WebApi. But then angular will have to process all the templates, and this will mean that someone will have access to the template on the front side, and he will be able to figure out what functions they do not need? Or should I check the role in the WebAPI methods and make sure they have the right role?

The next problem is localization. We will need to support several languages. I was hoping that we could only have different languages, en_gb.XML, and they would contain keys and their various translations. Then, if the user changed the language, I could just change something in angular, possibly using the value

angular.value("language", 'en_gb.js');

or

 angular.value("language", 'en_gb.xml');

Has anyone else solved such problems.

+7
angularjs asp.net-mvc single-page-application
source share
2 answers

Here I can help you in safety. You need to implement custom logic to hide \ show elements based on user role. While you can pass information about the user role to the client, you can implement this show \ hide logic. Keep in mind that this show \ hide command must be managed by the server, otherwise anyone can modify the data on the client side and gain access to the functions.

One way to achieve this may be to return to server templates (partial views) to the client for rendering (support for ng-include and ng-view support for load server templates). The server can check whether the user has access rights and returns an empty response if it fails. Thus, there is no possibility of information leakage.

A similar check can be added for all webapi calls and return an unauthorized status code for the end user.

+4
source share

Security. You must allow AngularJS to manage everything in the view, like a template, partial views, etc., because AngularJS is a full-featured Front-End framework. Since this is only the Front-End Framework, it is not responsible for server data, so just make a RESTful call to retrieve / save / update / delete data. And it is also NOT responsible for security, so what you call "WebApi" MUST be 100% server-side provided. So, even if someone can understand which call is not allowed to him, the call will not be successful, because his credentials will be checked on the server side. There are still malicious attacks for which AngularJS has an answer. See the "Security Considerations" section of http://docs.angularjs.org/api/ng . $ Http.

Localization: AngularJS supports localization of currency, date and number. But for strings, there is nothing else built into the language in your user interface. You must build your own answer. There are some attempts to achieve translation using AngularJS, for example here: https://github.com/firehist/grunt-angular-translate

+5
source share

More articles:


All Articles