How to protect javascript files?

Question

I know that it is impossible to hide the source code, but, for example, if I need to link a JavaScript file from my CDN to a web page, and I do not want people to know the location and / or contents of this script, is this possible?

For example, to link a script to a website, we use:

<script type="text/javascript" src="http://somedomain.com/scriptxyz.js"> </script> 

Now you can hide from the user where the script comes from, or hide the contents of the script and still use it on the web page?

For example, if you save it to my personal CDN, which requires a password to access files, will it work? If not, what will work to get what I want?

Answer 1

Good question with a simple answer: you cannot !

Javascript is a client-side programming language, so it runs on the client machine, so you cannot hide anything from the client.
Obfuscating your code is a good solution, but not enough, because although it is difficult, someone can decrypt your code and "steal" your script.
There are several ways to make your code hard stolen, but since I said nothing, it is bulletproof.

Above my head, one idea is to restrict access to your external js files outside of the page into which you embed your code. In this case, if you have

 <script type="text/javascript" src="myJs.js"></script> 

and someone is trying to access the myJs.js file in the browser, he should not be granted access to the script source.
For example, if your page is written in php, you can enable the script through the include function and let the script decide whether it is safe to return the source.
In this example, you will need the external js file (written in php) myJs.php:

 <?php $URL = $_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI']; if ($URL != "my-domain.com/my-page.php") die("/\*sry, no acces rights\*/"); ?> // your obfuscated script goes here 

which will be included in your main page my-page.php:

 <script type="text/javascript"> <?php include "myJs.php"; ?>; </script> 

Thus, only the browser could see the contents of the js file.

Another interesting idea is that at the end of your script, you delete the contents of your dom script element, so that after the browser evaluates your code, the code will disappear:

 <script id="erasable" type="text/javascript"> //your code goes here document.getElementById('erasable').innerHTML = ""; </script> 

All these are just simple hacks that cannot, and I cannot stress this: I cannot completely protect your js code, but they can convince someone who is trying to "steal" your code.

Update:

I recently met a very interesting article written by Patrick Wid on how to hide your js code, and it reveals a different approach: you can encode the source code into an image! Of course, this is also not bullet proof, but this is another fence that you could build around your code.
The idea behind this approach is that most browsers can use the canvas element to process pixels in images. And since the canvas pixel is represented by 4 values ​​(rgba), each pixel can have a value in the range of 0-255. This means that you can store a character (its actual ascii code) in each pixel. The rest of the encoding / decoding is trivial.
Thanks Patrick!

Answer 2

The only thing you can do is obfuscate your code to make it more difficult to read. No matter what you do, if you want javascript to be executed in your browser, they must have code.

Answer 3

Read this . It has a very good way to hide your code both in the view source and in a debugging tool like firebug.

Answer 4

As far as I know, this is not possible.

Your browser must have access to the JS files before they can be executed. If the browser has access, the browser user also has access.

If you password protect your JS files, the browser will not be able to access them, defeating the goal of having JS in the first place.

Answer 5

On top of my head, you can do something like this (if you can create server-side scripts that sound the way you can):

Instead of loading the script as usual, send an AJAX request to the PHP page (it could be anything, I just use it myself). Ask PHP to find the file (possibly on the non-public part of the server), open it with file_get_contents and return (read: echo ) the contents as a string.

When this line returns to JavaScript, create a new script tag, fill it with innerHTML code you just received, and attach the tag to the page. (You may have problems with this: innerHTML may not be what you need, but you can experiment.)

If you do this a lot, you might even want to create a PHP page that accepts a GET variable called a script so that you can dynamically capture different scripts using the same PHP. (Perhaps you could use POST instead, to make it a little harder for other people to see what you are doing. I don't know.)

EDIT: I thought you were only trying to hide the location of the script. This obviously will not help if you are trying to hide the script itself.

Answer 6

Forget it, this is not feasible.

No matter what you try, this will not work. All the user needs to do to find your code and its location is to look at the net tab in firebug or use fiddler to see what requests are being executed.

Answer 7

The Google Closure Compiler , YUI Compressor , Minify , / Packer / ... etc. are options for compressing / obfuscating your JS codes. But none of them will help you hide your code from users.

Anyone with decent knowledge can easily decode / de-obfuscate your code with tools like JS Beautifier . You name it.

So the answer is: you can always make your code harder to read / decode, but there is probably no way to hide.

Answer 8

I think the only way is to place the required data on the server and allow only the registered user to access the data as necessary (you can also do some calculations on the server side). This will not protect your javascript code, but will render it inoperable without server-side code.

Answer 9

As I said in a comment, I left an answer on gion_13 earlier (please read), you really cannot. Not with javascript.

If you do not want the code to be accessible on the client side (= stealable without much effort) my suggestion would be to use PHP (ASP, Python, Perl, Ruby, JSP + Java-Servlets), which is processed on the server side, and the user is provided only calculation / code execution results. Or, if you want, even a Flash or Java applet that allows you to perform calculation / execution on the client side, but the reverse engine is compiled and therefore more complicated (this is not impossible).

Only my 2 cents.