This question already has answers here:
How do I hide javascript code in a webpage?
(12 answers)
Closed 9 years ago.
I have a site where I display charts using JS data. I don't want other people to copy my source (meaning have them copy paste my html/JS, etc.). I have seen other websites with charts and if you view the source there is no data there. Are they doing something sneaky? How do I do that? Can you run it on the server side? Can you put it in another file and reference that one? I have the JS linked from an external file but you can still see all the a data in that one if you open it. What is the best way to keep the data from appearing in the source file? I'm not talking about obfuscating it.
Please read this related post:
This thread: How do I hide javascript code in a webpage?
Basically, if a web browser can read it, the end user can access it.
If you wanted to really make it more work to view the source, you would do all of the following:
Put it in an external .js file.
Obfuscate the file so that most native variable names are replaced
with short versions, so that all unneeded whitespace is removed, so
it can't be read without further processing, etc...
Dynamically include the .js file by programmatically adding script
tags (like Google Analytics does). This will make it even more
difficult to get to the source code from the View Source command as
there will be no easy link to click on there.
Put as much interesting logic that you want to protect on the server
that you retrieve via ajax calls rather than do local processing.
You can't hide your JavaScript since it has to execute client side. You can move all your js to external files, but that will not really hide it since someone can just reference the same files.
Basically the key point is that nothing done in JavaScript can be kept a secret from a skilled developer. JavaScript is inherently in plain text.
Related
I am coding a web app in Flask. I need to find a way to load "posts" with text variables (from external Python scripts) into an HTML file, ideally using pure Javascript (Not Jquery). The posts need to be loaded automatically, upon the opening of a page.
As of right now, I use the <body onload="function_name">, but I am not sure how to load more than one post. I know how to use python variables in html, but I also don't know how to use those variables to generate posts.
Any pointers/resources/code snippets would be immensely helpful.
I know that this question already has been asked before - and I find this answer to be very useful (https://stackoverflow.com/a/550583). Even though it doesn't completely deliver the wanted outcome.
Some background: I am building a small CMS where a website can be edited through the frontend. After the edit is complete the DOM is saved via PHP to a HTML file. Some websites include js-files which manipulate the dom or load data via AJAX. As those changes shouldn't be in the final output, javascript should be blocked. If you have any other idea how to go about it please let me know.
I hope the question is clear - how should I go about it, that the "external" javascript of the page is stopped, but I am still able to manipulate the DOM by my own js-file.
Thank you
You can implement a Content Security Policy to only allow JS to be loaded if it is from a specific domain. This will allow you to block inline JS and JS from other domains. You'll need to tailor it based on what you want to allow in the way of JS and other resources.
You can, and should, also sanitise the user inputted HTML.
This question already has answers here:
One big javascript file or multiple smaller files? [duplicate]
(7 answers)
Closed 6 years ago.
I have 4 types of js file and here are the list:
bookmark.js, status.js, auth.js and photo.js
Question:
Should i load the js only for specific page or i will compile everything into 1 js?
Does affect loading webpage if i use specific js for each page?
So, it depends, exactly in what you're looking for.
In case you're looking for loading speed, I think the best solution is keep them separated, it will allow the browser to load more than one js file asyncronusly.
But, if you need to have smartest code you should keep them in one single file, trying to reduce it more and more.
Remember that you should only think about this on your production code, absolutely is better to have different file working on them.
As you can see if you try the first approach you'll be more fast on page load. An example is a web application who need to load big amount of js files.
loading 3 file of 1MB will be always more fast that loading a single one of 3MB because they will start their loading in the same time.
Another approach is to load js files when your page requires them, but remember that in this case, if you have big js files, the client will see a lot of loadings during his surf on the website your working on.
Here you can read more about js file managment
Are you using any JavaScript front-end framework like AngularJS? If you really only want to include the required JS files you can do that.
In case all html pages use separate javascript files, its better to keep them separate. Based on users action they will be cached on browser end.
To optimize load time you can do the following
Use async inside your script tags so its not blocking rest of the
page and,
Use javascript minification on all of them this will reduce the size of the file and reduce the http payload.
This question already has answers here:
How can I obfuscate (protect) JavaScript? [closed]
(22 answers)
Closed 8 years ago.
I have written a lot of functions which use ajax to call PHP functions in my main.js file. The problem is that anyone can see my logic and internally called php file names of website by viewing the page source. How should I prevent the people from viewing my javascript file?
Javascript can be obfuscated, but there's nothing that's going to prevent a client from
seeing the URL strings in your code, or
simply inspecting the HTTP requests themselves to determine what URLs are being hit.
This re-enforces the importance of making sure you write solid and secure server-side code. You also want to make sure your web server is configured and secured properly, so that (for example) clients are unable to download the PHP source directly.
You can't stop people from viewing your javascript file, because the readable javascript code is required to correctly execute that code on your page. You can obfuscate the function names and minify the javascript to make it harder to read, but if someone wants to read the file, this will not stop them from doing so.
Instead, you should assume that everyone knows everything about your javascript file, and that everyone is able to alter your javascript file. You shouldn't put any validation solely in your javascript file and in every php page you should somehow check if the request that is made is valid (e.g. was the user allowed to do an ajax request to a certain page at a certain time?).
You can't able to hide the Javascript in browser, If you did that, your javascript related operations won't run.
you cannot hide javascript files. but you can minify the code so that, it will be very difficult for a man to read and understand your logic and all.
something like this
http://code.jquery.com/jquery-1.10.1.min.js
This question already has answers here:
Using HTML5/Canvas/JavaScript to take in-browser screenshots
(7 answers)
Closed 5 years ago.
I'm working on web application that needs to render a page and make a screenshot on the client (browser) side.
I don't need the screenshot to be saved on the local HDD though, just kept it in RAM and send it to the application server later.
I researched:
BrowserShots alike services...
Mechanized browsers...
wkhtmltoimage...
Python WebKit2PNG...
But none of those gives me all I need, which is:
Processing at browser side (generate screenshot of page). Don't need to be saved on HDD! Just...
...send image to Server for further processing.
Capturing whole page (not only visible part)
Eventually I came upon Google's Feedback Tool (click "feedback" on YouTube footer to see this). It contains JavaScript for JPG encoding and two other huge scripts which I can't determine what exactly they do...
But it's processed on the Client side - otherwise there would be no point putting this huge JPEG encoder in the code!
Anyone have any idea how did they made it / how I can make it?
Here is an example of the feedback (report a bug on some screens)
This answers your problem.
You can use JavaScript/Canvas to do the job but it is still experimental.
Update:
There is a library for this now https://html2canvas.hertzen.com/
I needed to snapshot a div on the page (for a webapp I wrote) that is protected by JWT's and makes very heavy use of Angular.
I had no luck with any of the above methods.
I ended up taking the outerHTML of the div I needed, cleaning it up a little (*) and then sending it to the server where I run wkhtmltopdf against it.
This is working very well for me.
(*) various input devices in my pages didn't render as checked or have their text values when viewed in the pdf... So I run a little bit of jQuery on the html before I send it up for rendering. ex: for text input items -- I copy their .val()'s into 'value' attributes, which then can be seen by wkhtmlpdf