question on script security

**gib65** · 10-18-2017, 03:14 PM

Hello,

We're developing a web app and we're wondering if there's a way to prevent the user from inspecting the page or seeing the javascript. Most browsers have a console that you can open up and see the DOM elements and any scripts running on the page. Most of them even allow you to hover over variables and see the data, some of which might include database IDs and other private information. While we try to make as little sensitive/private information available as possible, the fact that users can inspect the page and view information behind the scenes is a bit of a security hole.

What we want to know is: can the viewing of DOM elements or scripts be disabled from the web app side?

Or: can we at least minimize the javascript when we deploy?

For this last part, we are using Visual Studio 2015, and Gulp packages to package everything together (javascript, CSS, etc.) during deployment. All I would need to know is how to setup a gulp package to minimize the Javascript (which is packaged into one file during deployment called app.js).

Does anyone have any tips on how to make sensitive information a bit more secure in the browser console? Thanks.

**jscheuer1** · 10-18-2017, 04:04 PM

There are various free and paid online services, as well as various free and paid apps for minimizing and/or obfuscating javascript. You can use Google to find them. Some of these don't work very well or may have intimidating interfaces (there are so many, I would avoid any of those). Others may require that the javascript is validated to strict standards before they can work. None of this truly protects your code, but it does make it harder to reverse engineer it. Obfuscation is more valuable to that end, but minimizing also makes code harder to follow.

**molendijk** · 10-19-2017, 01:18 PM

There's no way to completely hide Javascript from the user, since the browser needs to download it to run it.
As John said, you can try to use a service that obfuscates code for you, like this one. Another way to accomplish what you want is to write two documents for each page of your site:
1) a document (for ex. 'file1.html') that contains your original HTML, Javascript, CSS etc.
2) another document that loads the above document via jQuery, like so:

Code:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>$('html').load('file1.html')</script>
</head>
<body>
</body>
</html>

The first document should be the 'hidden one'. The second document won't (directly) show the Javascript of the first document.