How to hide the data in source code from the user

Question

As a side project to learn Web Development, I'm writing a web app in Javascript that allows my fellow classmates type in our Class ID # to a search field. If they enter the correct Class ID, they will automatically be redirected to our Google Groups page. The only problem I'm seeing is that since I'm running multiple Google Groups for different classes that I'm taking, I don't know how to hide the javascript code.

Example in Pseudocode: 
If (input === 12345){
  redirect to (LinkToClass1GoogleGroupsPage.com)}
Else If (input === 12344){
  redirect to (LinkToClass2GoogleGroupsPage.com)}

The problem here is if they right-click and view source code, they will clearly see what inputs I'm looking for. I'm new to Web Development and I would like to know what's the best way to implement something like this.

you may block right click on the page. You may minify your script once development is done which would make it difficult to understand. — Akshay Khandelwal, Oct 21 '13 at 12:49
You can use ajax to request the link sending the id. So that routine will stay in server side. — DontVoteMeDown, Oct 21 '13 at 12:49
But be sure that there are tools that override the above mentioned things like someone may have firebug or alternatively may use right to click plugin in firefox and stuff like that. minifying the code is safe idea — Akshay Khandelwal, Oct 21 '13 at 12:50
offcourse I forgot to mention that would work as it is. So in above mentioned scenario you may load the data from server which would not be stored along with the html while saving the files — Akshay Khandelwal, Oct 21 '13 at 12:51
For some reason my answer got downvoted. You can crypt your javascript code into spaces and tabs, and than attach parser. In this way the code will not be visible. I've seen that done and there are libraries to do this. Although it's not the best solution, this is probably the only solution. Voting up an answer that says it can't be done seems silly to me. — Max Koretskyi, Oct 21 '13 at 13:54

score 2 · Answer 1 · answered Oct 21 '13 at 12:48

2

You cannot hide JavaScript code. If you have a secret, keep it on the server.

answered Oct 21 '13 at 12:48

woz

10,888
3
34
64

4

Nice approach but this is not an answer. – DontVoteMeDown Oct 21 '13 at 12:51
3

It is an answer. I don't know what server-side language the OP is using, if any, so can't really say anything else. – woz Oct 21 '13 at 12:53
I agree to Woz. If at all there is a secret, you must keep it on server. Call a webservice or make an ajax call to get the data. But javascript can not be kept secret – Akshay Khandelwal Oct 21 '13 at 12:59
I just said that this is too superficial to an answer. Try to explain how it works to the OP to clarify your anwser. – DontVoteMeDown Oct 21 '13 at 13:02
1

@woz you could explain why and how to do it with some sample. This kind of post, looks like a comment and not an answer. – Felipe Oriani Oct 21 '13 at 13:12

score 1 · Answer 2 · edited May 23 '17 at 12:28

Anything on client-side environment is readable unless it is encrypted - what doesn't works with JavaScript. You can use a server-side environment to deal with that without leaving JavaScript with node.js, look this post.

Use an ajax request(jQuery or pure) to a node.js service or any other server-side language of your choice and keep those actions out of user's sight. This is safer, right and maybe only way to do that.

Nunners · Answer 3 · 2013-10-21T12:57:49.930

Probably the most secure way for this to be done would be to have a Server Side function that can be called via Ajax to return the link.

What type of Server Side code you use depends on your preferences.

For example ASP.NET Web Service, PHP, ASPX Web Methods.

Below is example Ajax Request Code using jQuery :

    var o = new Object();
    o.ID = input;

    var x = JSON.stringify(o);

    $.ajax({
        url: 'SOME URL', //Path to the Server Side function (i.e. Php / ASPX Web Method / Web Service)
        type: 'GET',
        dataType: 'JSON',
        contentType: 'application/json;charset=utf-8;',
        data: x,
        success: function (data) {
            //Method returned without issue
            redirect to (data.d)
            //data is a JSON object that contains a "d" property, if your function returns a string then d will be the value of the string.
        },
        error: function (ajaxrequest) {
            //Ajax call received an error.
        }
    })

score 0 · Answer 4 · answered Oct 21 '13 at 12:54

0

You cannot literally hide the data in JavaScript, unless you use a server-side language to redirect.

What you can do however is obfuscate your code, there are tools to help you do this.

http://javascriptobfuscator.com/

"LinkToClass2GoogleGroupsPage.com"

Results in

var _0x2ec6= ["\x4C\x69\x6E\x6B\x54\x6F\x43\x6C\x61\x73\x73\x32\x47\x6F\x6F\x67\x6C\x65\x47\x72\x6F\x75\x70\x73\x50\x61\x67\x65\x2E\x63\x6F\x6D"];_0x2ec6[0];

answered Oct 21 '13 at 12:54

Azeirah

6,176
6
25
44

1

This makes your code impossible to debug, and obfuscation != encryption. – woz Oct 21 '13 at 12:55
1

Security through obscurity usually is a bad idea, some day sooner or later someone will discover it and all hell breaks loose – Muleskinner Oct 21 '13 at 12:57
In the case of hiding data from students, obfuscation shouldn't be *that* bad, unless they are CS students eager to crack his site. – Azeirah Oct 21 '13 at 13:42

score 0 · Answer 5 · answered Oct 21 '13 at 13:18

0

This cannpt be done yet. HTML5 might have DRM implementations in the future but this will also depend on browsers opting in for this feature (Mozilla are against it for example).

answered Oct 21 '13 at 13:18

Alexis Vincent von Blumenthal

31
7

score -3 · Answer 6 · answered Oct 21 '13 at 12:53

-3

Disable right click and ctrl button thats all you can do! :D

answered Oct 21 '13 at 12:53

Mohsin

17
7

2

This still won't hide the code. Ctrl+Shift+I is all it takes to bypass this. – woz Oct 21 '13 at 12:54

How to hide the data in source code from the user

6 Answers6