10

A div(contains secure information) in my HTML page has to be displayed based on a permission.

  • How safe is it to use ng-if to hide the div in this scenario?
  • Will a user be able to hack and view the div which contains secure information?
3
  • 4
    anything is not secure if u send it to the frontend Commented Dec 18, 2014 at 8:57
  • 2
    When writing a web-based aplication, you should assume that users can access anything you send to the browser. If you want to restrict access to some data, do it on the server side.
    – hon2a
    Commented Dec 18, 2014 at 9:00
  • A user with even a small amount of web debugging knowledge will be able to view anything that's in your HTML, whether it's visible or not.
    – JLRishe
    Commented Dec 18, 2014 at 9:00

5 Answers 5

21

You should not be hiding anything for security purposes in the 'front-end' (ie. using Angular). It is trivial for a user to access content hidden using ng-if, ng-show, ng-hide, etc.

You should instead hide this data on the back-end and never pass it to the browser in the first place.

Simple security rule: If the browser has access to it, so does the user.

6

Adding to the points already mentioned in these answers, you should keep in mind that the when you are running webapps, then the user has access to your entire client's code. So, you should, never even think of hiding sensitive data at client side.

Also, you should know a little more about difference between ng-if and ng-show,ng-hide. Quoting from AngularJS's website

ngIf differs from ngShow and ngHide in that ngIf completely removes and recreates the element in the DOM rather than changing its visibility via the display css property. A common case when this difference is significant is when using css selectors that rely on an element's position within the DOM, such as the :first-child or :last-child pseudo-classes.

So, it is NOT safe to hide sensitive data at front-end. Depending on the user's permission level, you can make a separate API call to fetch the data. At the server, verify the permission and return appropriate response.

3

ng-if does not render associated information in the view. However, it depends on the data in the $scope whether or not to display the information. Also, the displayed information is also in the $scope. Using browser extensions, such as Batarang (or even simple javascript), a user can display the entire $scope hierarchy with the contained values.

So... no :) don't expect AngularJS to hide sensitive information for you

2
  • I believe if you set debugInfoEnabled(false) you will not be able to access scope with Batarang?
    – sir_K
    Commented Aug 22, 2017 at 8:58
  • 2
    I just realised this can be enabled back at any time by typing angular.reloadWithDebugInfo(); into console.
    – sir_K
    Commented Aug 22, 2017 at 9:08
2

How safe is it to use ng-if to hide the div in this scenario?

Not at all safe.

Will a user be able to hack and view the div which contains secure information?

Absolutely, yes.

2

Actually in angular js you can debug, so user can access the object that you are using to toggle the ng-if and change its property. you might want to use ng-bind-html and bing that div as a module that would be safer but not complately

Not the answer you're looking for? Browse other questions tagged or ask your own question.