Where are these javascript functions defined in this website?

I was wondering whether is it possible to hide javascript files when visiting a website. In a first moment I thought it was not possible, you can obfuscate the code as much as possible but it will still be accessible to the user.

However I started reading some blog posts and sites that suggest some hacks to "try" to hide the js code. Some of the posts I read where theses:

http://www.webmasterworld.com/forum91/2713.htm

http://www.codingforums.com/archive/index.php/t-23293.html

I haven't understood them very well. Can someone explain them to me?

And here is an example: I have been browsing this page http://www.regexbuddy.com/ and I started looking at the source code with google chrome inspector to find out how were the functions that show the menus drop-down list implemented. I could see that every menu item has an onmouseover="showpopup(x);" event. Unfortunately I was not able to find this js function "showpopup", neither other javascript functions used throughout the code (showmenu for example). The server sends 2 javascript files menu.js and jgsoft.js but none of these files contained the functions definitions. These functions were neither defined in the html as inline script.

The curious thing is that if in the google console I type window.showpopup I am able to read the function. So where are these functions defined? Possible开发者_如何学运维 hacks to "try" to hide javascript files? Ways to bypass these hacks?

In the case of regexbuddy.com - the code is all in this file, as you guessed, but it's packed using packer. It's probably packed to try to deliver it faster, rather than to make it difficult to read, but it could be both reasons.

You can "unpack" it by pasting the contents of jgsoft.js into this tool.

So basically- yes you can hide all of the code, but since the browser has to execute it, it will always be possible to get at.

Javascript's eval() function takes a string as a parameter, parses the contents of that string as javascript source and executes it in the calling context. This is generally at the heart of such obfuscation code.

On your sample page, the file jgsoft.js contains javascript that, when executed, generates a string that contains the definitions for the functions it needs, then uses eval() to execute that and thus define the functions.

If you first go through the function and add line breaks / whitespace at relevant points, you can use a Javascript debugger that lets you step through execution line by line and view execution state, like Firebug, to observe the process.

In this case, the packing seems to have been done to make the file smaller, rather than just to obfuscate. In general, javascript obfuscation is pointless: if your browser can see it, so can you.

Here's a standard hack for you -

document.write(
  '<scr' + 'ipt type="text/javascript">function fo' + 'o(){alert("hello!");}');

Try searching the source for foo() :)

Ultimately, the script is always there - because Javascript is an interpreted (i.e. script) language, the source must be loaded naked at some point in order to be executed. It might be obfuscated, but it must be there.

So, no, you can't 'hide' javascript source - you can just make it difficult to find. Generally, a debug + step-through is the answer; if you have the patience.