Serving personalized javascript code to a client - javascript

First of all, I've tried to look for answers in different questions and forums, but I've struggled to find the correct search keywords, so I haven't found anything relevant.
Basically, I've taken on developing a simple implementation of a live chat widget for websites, similar to olark, liveChat, etc. Since, I will be using Socket.IO, I am looking for an easy way to provide the javascript code to a potential client (which might very well not be tech savvy). So the idea is to have just a simple <script> tag which either dynamically creates another script tag with the source pointing to my server, or just a script tag with the correct source.
The problem I have is regarding the server response to that request. In the test implementation, I am adding a script tag which makes a call to the server and the server responds with the javascript code in a string, which I find a very crude way to do it. The reason why I can't just serve a simple javascript file is, because it needs to be personalized, so I can keep track of where the client is connecting from in order to get the to the proper "agent" (manager of website). I could probably create separate files for each user, but I am not sure how maintainable and efficient that would be.
So my question is, how would I serve this personalized javascript code in an efficient and secure way? I am using Laravel as a backend, if that makes any difference.

In the test implementation, I am adding a script tag which makes a call to the server and the server responds with the javascript code in a string, which I find a very crude way to do it.
If it works for your needs, this is a good solution.
If it feels crude, there are a few things which can help keep it clean. Keep your javascript in a separate file and use file_get_contents to read from that file. Where you need to use placeholders to personalize this, you can add %s and use sprintf to pop in the personalizations.
There are a few pretty large ad networks out there which are serving up javascript in just this fashion so I do not believe there is anything inherently wrong with this method.
As far as security goes, I'm not sure what you can do besides making sure everything is served via HTTPS. I'd hope that there is no need to pass sensitive information via get variables.

You can transmit just the javascript without a <script> tag to the client and then use eval() to run the code there.

Related

is there way to compress javascript with my own method?

I wanna know, is there a way to compress javascript with a method that cannot be easily uncompressed by another?
I have used some tools like jscompress and other products. They're nice and useful, but they provide methods to uncompress/decode script too. The problem is other programmer or maybe hacker, can easily uncompress my script, the impact is my js ajax link, variable can be seen by the hacker. You know that what happen if they found our link. Maybe post direct value via ajax etc.
There is not a way to do this in client side javascript, it is inherently insecure. You should be using a call on your server to hide your API key.
FAQs from the w3:
http://www.w3.org/Security/faq/wwwsf2.html
If by your question you mean that you do not want the variables and Ajax links in your script to even be accessed by others ever, then you are talking about encryption, not just compression.
If the code was truly encrypted so that the Ajax links were not recoverable, the browser could not decrypt and therefore not even execute the script.
Obfuscators will make your code fairly illegible, but you are not going to be able to hide destination URLs in Ajax calls from hackers. All one needs to do is look at the browser's developer tools and watch the network calls.
It's important to design your application with the assumption that users and hackers are able to see all the JavaScript. If you can keep it secure under these conditions, that's ideal.
So if the question is just about making your code hard to read, obfuscate. But the kind of security you seem to be asking about needs to be done server side.

Why does this link to a JS file return Unauthorized, but it works in HTML?

Is it possible to not allow people view one of my website's JS file?
Demo:
http://js.maxmind.com/js/geoip.js
If you copy the URl and paste it in the browser, it will say "Unauthorized". But if you put it inside the HTML, it will do it's work.
Can I do that with my code.js file?
JavaScript is an interpreted computer programming language. It's not being compiled and it runs on the client's browser/computer, therefore, the client must see the script in order to execute it. That's why you cannot hide the code.
You can define in your server folders as restricted and that means the user can not access them directly, but when the browser loads the page it have to load all the components such as images, css files, js files etc...
If the browser can load them, it means the user can see them as well.
For example, you can also define that users are not authorized to see any .jpg files but they can easily save any image. Actually the browsers usually saves the images anyway on your local computer and cache them, so next time you load the page, it won't have to download files that weren't changed again.
As others already mentioned, trying to hide a js code is very bad practice and you need to avoid it. If you want the make the life hard for other developers that wants to copy your code you can use this site to obfuscate your js code, but remmeber, it only makes it harder to read by humans, it does not provide you any security.
First, let me explain loud and clear: that is the worst security I can imagine for what it is trying to do. It is just shouting, "HEY NOBODY LOOK AT THIS INSECURE FILE."
Your question has been viewed 41 times so far. That means up to 41 people are wondering what that mysterious does and probably half of them can find easily out. In short, don't do this.
There is no client side security. I refer you to this answer, for instance.
As for how to implement the situation, as noted in comment it's probably done by checking the referrer header. To find out fully check the request headers in the dev tools in your browser and compare to the request headers used by curl (e.g. by using a post bin).
It is not possible to not allow people to view one of your website's JS files.
To be more precise, if someone can execute your JS file, they can view it.
Although you cannot prevent a user from being able to look at your javascript you can make it extremely difficult for them to understand what they are looking at through obfuscation or minification, for the latter there are many services that will do this for you; look at this for example. As for obfuscation I don't know of any way to do it automatically but it would be a similar approach.
If you have information in the javascript that you truly cannot allow a user to see, then I would suggest moving it into the server side code and only pass to the javascript the absolute minimum. As I am not sure what you are using on the server side I cannot give you a specific example; however in the past when using MVC I achieved this by passing the values I needed either to a hidden input ( if the value needed to be posted back with a form) or through jQuery.Data

Dynamic JavaScript Obfuscation

I've developed a system that polls a server and injects the response JavaScript into the clients web page. I want to obfuscate the JavaScript the server serves, but I also want to know if there is a tool that dynamically obfuscates it according to a token or key. Meaning every new session gets unique scripts that will only work with that client during that session.
If this doesn't already exist, could someone maybe provide me with a link on how to write my own JavaScript obfuscation tool.
Chris, I encourage you to look at this a different way.
First of all, your problem seems to be that you want to display something on your web page, but you want to disguise the methodology that it got there. The absolute best way to do this is to execute all of your code on the server.
This frees you up so that you don't have to obfuscate anything. Any Javascript that you execute would just be working on raw data anyway, and wouldn't be anything specialized that a hacker could do anything with.
A hacker could not see your business processes if all of the work was done on the server.
So, you can make an Ajax call out to the server, which executes the code, and returns HTML or JSON data that your app can then use to place on the webpage. The hacker has nothing to go on, and you don't have to build obfuscation into anything.
Heres a page that encrypt javascript acording to a key
http://scriptasylum.com/tutorials/encode-decode.html
Something you can do, to hide your javascript, is to send it this way:
<?php
header("Refresh: 0;javascript:document.writeln('');");
?>
your js code here
I have not tried it,but I think It will create a empty page wen viewed by a browser.

is json the answer to this: python program will talk and javascript will listen?

the same problem haunting me a month ago is still haunting me now. i know ive asked several questions regarding this on this site and i am truly sorry for that. your suggestions have all been excellent but the answer is still elusive. i now realize that this is a direct result of me not being able to phrase my question properly and for that i am sorry.
to give you guys a generalized view of things, here i go: the situation is like this, i have 2 server side scripts that i want to run.
a python program/script that continuously spouts some numbers
based on the output from that python script, a javascript script will perform some action on a webpage (e.g., change background color, display alert message, change some text)
ive studied the replies to my previous posts and have found that what i want to accomplish is more or less accomplished by json. it is my understanding that json transforms 'program-specific' variables into a format that is more 'standard or general or global'.
two different programs therefore now have the means to 'talk' with each other because they are now speaking the same 'language'.
the problem is then this, how do i actually facilitate their communication? what is the 'cellphone' between these server side scripts? do they even need one?
thank you!
If I understand what you're asking, the "cellphone" is TCP/IP. The javascript is not server-side; it runs on the client side, and alters what the client's browser displays based on json data that it downloads from the server -- data that in this case is generated by Python.
This question provides a relevant example, though it's a bit technical: JSON datetime between Python and JavaScript
Here's a very basic tutorial that explains how to create a dynamic webpage using python and javascript. It doesn't appear to use json, but it should familiarize you with the fundamentals. Once you understand what's there, using json to transport more complicated data should be fairly straightforward.
http://kooneiform.wordpress.com/2010/02/28/python-and-ajax-for-beginners-with-webpy-and-jquery/
I assume you mean: Python is on the web server, and Javascript is running in the client's web browser.
Because browsers are all different (IE6 is terrible, Chrome is great), there are a huge number of ways people found to "hack" this "cellphone" into place. These techniques are called AJAX and COMET techniques. There is no one "cellphone", but a whole bunch of them! Hopefully, you can find a library to select the right technique for the browser, and you just have to worry about the messages.
Comet is harder to do, but lets the server "push" messages to the client.
Ajax can be easier - you just periodically "pull" messages from the server.
Start with Ajax, then look at comet if you really need it. Just start by have the client (javascript) make a "GET" request, to see if the number has changed.
I don't know Javascript or json, but...
if you've ever seen an Unix-like operating system, you know about pipes. Like program1 | program2 | program3 ... Why don't you just connect Python and Javascript programs with pipes? The first one writes to stdout, and the next one reads from stdin.
This probably isn't the answer that you are looking for, and without links to your previous posts, I don't have much to go on, but nonetheless...
javascript is client side. I can interpret your question 2 different ways...
Your python script is running on your computer, and you want a script to actually alter your current browser window.
Not too sure, but writing a browser plugin may be the answer here.
Your python script is running on the server, and as a result of the script running, you want the display of your site to be changed for viewing persons.
In this case, you will could use ajax polling (or similar) on your site. Have your site be polling the server with ajax, call a server method that checks the output of the script (maybe written to a file?), and see if it has changed.
When 2 process need to communicate, they need to decide of a common/shared way to express things and a protocol to exchange those things.
In your case, since one of the processes is a browser, the protocol of choice is http. So the browser needs to do an http request or regular http request to your python process.
This python process Will need in Some way or another to be exposed via http.
There are several ways to build a web server in python. You should read this article : http://fragments.turtlemeat.com/pythonwebserver.php as a jumpstart.
Once you have this, your browser Will be able to issue HTTP GET requests to your server and your server can reply with a string.
This string can be whatever you like. Nevertheless if your answer contains structured data it can be a good start to use the XML notation or the json notation.
Json (stands for Javascript object notation) is very easy to use in javascript and this is why many people advised you to choose this notation.
I hope this will help you
Jérome wagner

Variables in URI for jQuery / Javascript

I'm sure this is a very dumb question, but I haven't been able to find any good explanations regarding what I am confused about.
When using a CDN, say, Google for jQuery, how does the version variable work in the URI? Yes, I understand how $_GET works in PHP, but how does this work for a non-server-side script?
Thanks in advance.
You have several possibilities to have this feature actually.
First, you could simply configure a part of your server structure to process files with slightly different rules. You can imagine a folder where all .js files are actually sent to a PHP script or a CGI for processing. The fact that the file ends with .js is a mere convention. It does not guarantee that the content is javascript at all. The processing script would read the query params and send back the appropriate data to the client. A bit convoluted, but it could work.
Second, with URL rewriting, you can pretty much do what you want. So even accessing a jquery.js?version=1.4.2 doesn't mean it will actually hit this file precise.
It can be redirected to a processing script and be totally transparent to the client. This technique is used extensively in wordpress to get clean and SEO friendly URLs for instance. Probably the best option if you are looking to implement this yourself. mod_rewrite is a bit tricky to learn but the profits you can reap are worth it.

Categories