Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

preventing javascript hacking

Hi guys, I've used javascript to hide elements on a school website where student will have access to. I've realized that a savoy student would be able to hack the javascript to where he/she could see things not intended for the students. Would there be a way to disable js hacking or make it difficult for someone to hack into?

3 Answers

As a general rule, if it's publicly accessible (or accessible via login) it can (and will, in the case of students!) be accessed. There are numerous tricks that sites try to use but nearly all I've encountered have some type of workaround. I'm sure there are probably some complicated ways to make it very difficult, but I've never seen a 100% secure client-side, non-compiled solution. In essence, by using HTML/JavaScript you are handing over your source code to a third party and asking them to run it. The primary solution is to move sensitive data to the server and only grant access to it when a user is allowed to see it.

I would rethink the problem in terms of data, as opposed to elements. A little more info on what you are trying to hide may help but here are the 2 most common scenarios I've encountered:

  1. Hiding data (like quiz answers). The solution to this is to validate input on the server. For example, you can present the question, get the answer via jQuery or a similar techniques, then send it to the server for validation (e.g., via AJAX). Then you can determine what to send back (e.g., a "yes/no" response, a more detailed list of information, etc). Only after this response/request do you then display what you want to show in response.

  2. Hiding content (like administrative portals): these should never be sent to the client unless they are authenticated and authorized (e.g., via an admin login portal).

Thanks for your input. If it may help, have a look at the running site. It's the online program for a charter school and there the students have access to the course content. Except the answer keys which is for the teachers. Right now, i'm using javascript to hide the answers. Obviously, this may not be the best solution, but it saves time for changes and updates, because I have everything linked to the main server IE (the teacher site) and just using JS to hide the course tabs that should not be seen. Otherwise... The updates will be getting very messy. Also, notice we have 3 different school with many of the same classes, so for updates, I have to updates/changes, i have to do things 3 times, usually.

Another suggestion I've heard, was just try and hide or alter with server side php code. Would that work.

Here's the link: http://ops.emsofl.com/

ps. They are running the teacher site on op.emsofl.com that is protected by a universal password, which I think would be kinda just as easily hackable, yet that is how it was done before I started here.

Ah I see what you mean. I think the server-side approach is, unfortunately, the only real secure way to go. I would imagine it would be roughly the same amount of work, or maybe less, in PHP since you'd just have an if/else construct to determine what to output, but that depends on how the site is built. From a non-technical perspective, it looks like the classes involve older kids, so I would assume at least a few are savvy enough to open the web inspector and poke around.

If teachers can access all the content via op.emsofl.com anyway, is there any need to have the sensitive data on the guest-facing site?

Well the thing is ive asked the web admin to point to one central server ie the teacher server, where all the data is because it is easier for me to just have to make all updates on one server rather than two. Like, when i have to add/change or update files.

I suppose I could ask him to separate the servers again, but that would make a lot of work to manage the 2 sites as opposed to 1 as it is now. Do you see what I mean? If I can do it more securely in php, that would be a good option. I am using some php now, but I'm not great at it so would definitely need to look up how to do it.

I also have other projects to work on besides maintaining and managing these sites. Which is why I went this route.

basically, if is there a way to reproduce in php:

 $("dd").each(function(){ var a = $(this).find("a"); 
  if(a.text() == 'Study Sheets Answer Keys' || a.text() == 'Graded Assignment Answer Keys' || a.text() == 'Lab Answer Keys') $(this).hide();});

```javascript