I want to add a button to one of our web sites that will allow the user to file a bug with our bug tracking system.
One of the feature requests is that a screen cap of the page in question be sent along.
Without installing something on the end users machine, how can I do this? Does javascript have some sort of screen cap api?
You may grab the innerHTML of the page and then process it on the server:
document.getElementsByTagName('html')[0].innerHTML;
// this would also be interactive (i.e. if you've
// modified the DOM, that would be included)
No, javascript does not have anything like this.
I'm afraid that this will be quite hard. I can not think anything that would do this without installing on users computer.
I'd like to be proven wrong, but atleast this is an answer for you.
Get as much Info as you can about the user environment using jQuery. (jQuery.support) / user agent / cookies / form input values, the url (for get parameters and to know which page had an error)
Send the source of the page like mentionned by Moff.
Try serializing the DOM as it is now so you can compare what is different from the original page.
It is also useful to send the source of the page if you need to keep it for historic purposes, since when you update the page, it will be become different.
I'd suggest some sort of integration with FireShot which is a Free Firefox/IE addon.
I agree with the other answers -- no dice.
However, there is a firefox plugin, the Pearl Crescent Page Saver, which might be worth looking into for related tasks.
Take a look at pagecrop (implemented with jQuery + jCrop plug-in)
I must be missing something, but can't you just...
Press PrtScr on keyboard and paste into email.
See this question. Basically, no, not with javascript. Perhaps with ActiveX, but that's back to installing things on the client's PC.
Consider writing a server-side script that repeats the user's request exactly (assuming it's not after a POST) and storing the resulting html file.
You might look into using a web based solution such as the one offered at Super Screenshot! or WebShotsPro.com. Depending on your needs, such as screenshots of specific areas of pages, or pages inaccessible from the outside world, it may not work for you, but it is an idea.
Chrome plugin
https://chrome.google.com/extensions/detail/ckibcdccnfeookdmbahgiakhnjcddpki
You can also take a look at how Evernote does its screen capturing and maybe you can tie in to that or create your own chrome extension. https://chrome.google.com/webstore/detail/evernote-web-clipper/pioclpoplcdbaefihamjohnefbikjilc?hl=en
Related
I would like to know if there is a way to prevent an html page with jQuery or javascript to be modified by the user to change its behavior.
A user can modify it using tools such as FireBug or the Google Chrome developer bar to hide or show divs, add event listeners to page elements and so on.
I've seen some web pages showing a blocking div when the page is loaded and a pop-up telling to answer some question. If you answer it, the div hides and you can see the page normally.
But if you try to hide the blocking div using FireBug, the page reloads and there is no way to see the page correctly if you don't ansewer the question asked in the pop-up.
I want to know how could I prevent user from doing such things.
Thanks a lot.
It is not possible (which is a very good thing).
To defeat the method described in the question:
You can use the keyboard shortcuts to the console/tools (Ctrl+Shift+I in Chrome)
You can use the resource/net panel to see the source
You can see it at any other level, e.g. Fiddler
You can use a bookmarklet for easier access
No, you can't prevent people seeing or modifying your source/script if they want to...the ones you most want to prevent are the most able to circumvent any deterrent (and that's all anything you do is, a deterrent, not a stop) you put in place.
The only way to do it (in my opinion) is not have the page content load until the user does your desired action. After he answers the question (or whatever) you send an AJAX request for the content (of course, as thejh said, you should also validate the answer on the server, preferably in the same request). So you load page header, banners and anything not critical, but the actual content (say an article on a blog) should not be loaded until the user does your action.
Everything that a user's browser receives belongs to the user, so you can't enforce anything on that.
For sure you can't prevent anybody from doing what he wants to, but you can make changes more difficult.
Take a look at the DOMEvents, especially the Mutation-Events.
Those give you the ability to see when something has changes(attributes, removed/inserted nodes, data in textnodes ...). For example you could build a function that watches some special attributes you would'nt have to get changed and reload the page, if this happens.
As others have already said, it isn't possible to control what the end user does with data you've sent them.
It may be possible to detect the console object that Firebug and others use, but what can your site do with that information once you've got it? You can't disable firebug or prevent it from being used, or even know whether it has been used.
The bottom line is that once the web page and javscript code have been sent to the browser, it is out of your control.
The closest you can get to what you want is to move some of your code out of Javascript and to the server, where it will be untouchable by the user. However you'll still have to have some client-side code, which will still be at the mercy of malicious users.
The other alternative is to move to Flash or something similar, where the end user doesn't have direct access to the code or the object model. This has it's own downsides though, and you'd be bucking the trend, which is to move away from Flash toward HTML5 and Javascript.
It's impossible. When you send code to the client, the client can look at it and modify it. Only code that runs on your server is protected aganist that.
I don't think it's possible to do that unless you can make sure (or force) users to use browsers that don't have developer tool.
Use ajax to get remote information don't send the user all the information such as answers to polls etc get the answer after he picked a choice from the server using ajax for example. Client-side validation is never a good thing hell thats how I used to delete other stupid people's databases due to that unless people learn properly how things REALLY work they should get taught the hard way such as losing everything in a case of root access vulnerability.
I don't know why HTML has to be blocked it wasn't blocked since browsers came out he'll I could make my own browser with a socket and get HTML transfered right to some textbox and see it in my favorite notepad/editor etc..
As for javascript you can simply send javascript commands in browser address bar (how convenient of browsers in supporting hackers hehe but it's also used for inter-op communication with other technologies such as flash so it has a evil/good side to it as everything.)
If you didn't know you can just do
javascript: alert('hi');
or if your javascript game or whatever has globally scoped variables you can modify em easily
javascript: score=9999;damage=99999;
etc etc like i said it's all good it weeds out the bad programmers and gets em fired or teaches em a lesson in the future.
I've seen many big sites still fall to a SIMPLE XSS attack (Cross-site scripting) which is just baffling how these programmers get a job, I'd do a better interview or some shit it's ridiculous
I am usually downloading several jQuery plugings.
How can I check whether the script is stealing any information (such as user cookie, session id..) and sending to its developer's server?
In php, we are checking backdoor scripts by looking for some functions (system, passthru, shell_exec, etc). Is there any such type of function in JavaScript to connect to its developers site?
Obviously, your first step should be to read the code. There are a number of tell-tale signs you can look for, including looking for URLs in the code, and any encrypted code.
Of course, some code may be too complex to make this a realistic suggestion, particularly if it's been minified and obfuscated, but it should be possible to scan through it. If it is doing anything like this, it'll be using the same functions it uses to communicated with your own site (ie jQuery's ajax functions), so you won't see specific function calls that raise suspicion, but suspect URLs in the code should be checked out, and you should definitely avoid encrypted code (obfuscated is generally okay, but not encrypted).
Secondly, search the internet for other people commenting about the plugin. If there is anything untoward happening, its likely that other people will have noticed it. Avoid using plugins that don't have enough users to get any comments one way or the other.
Finally, use a tool like Firebug to watch for HTTP requests that occur while you're using a site containing the plugin. If it's communicating with base, it can't hide from you; the browser's debugging tools will happily show you what you need to know.
Hope that helps.
I don't think you can do anything else than read the whole code, and check if it is stealing anything.
Another thing you could do, is to search in the codes after words like 'document.cookie' and 'navigator' and other things that are necesary for stealing information.
I would like to know if there is a way of tracking who is using my jQuery plugin by using some javascript code inside the plugin itself. My plugin is being used on different sites, so I'd like to know where it is being used and how many times it is being accessed.
You could just present a registration form for people to fill out before the download the source code, asking them for some basic contact information and the website they'll be using it on. I don't think #SLaks' idea of a 1x1 pixel gif is that bad of an idea, however it does cause additional load on both your server and it's also an additional request for the visitors to all the sites that use your plugin.
Because jQuery plugins are just plain JavaScript code, many people might just remove the part that adds the tracking image, considering it to be an invasion of privacy or just a waste of resources, or for whatever reasons. They may feel like it was trickery or it was "snuck in". Asking for people to register however it a clear demonstration of your motives. It's not sneaky, you're clearly wanting to track usage and I think most developers will understand that.
Even if the registration form is optional it should give you a pretty good feel for who's downloading and using your plugin.
You could create an <img> element in the plugin that points to a server-side script that increments a counter. (This would work across domains)
However, this could be viewed as spying, especially for intranet sites.
It would probably be very controversial; I wouldn't recommend it.
You could easily do a get request to an API on your server. For example just
$.get("http://youserver.com/api/track/");
And then on your server you could see who was it was that used your plugin using PHPs $_SERVER["REMOTE_HOST"] and incrament a counter.
I am trying to record the time it takes to load my website on an average (say 10 runs) from various locations in the world. For this, I was thinking of using a list of proxies to achieve this and am not sure this is the perfect way of doing this.
Is there a Firefox add-on that lets me time this perhaps using Firebug itself?
Is there an alternate way of running this test?
Any tips from the testing community would be awesome.
"Net" tab in Firebug
Google PageSpeed
Yahoo YSlow
You can also add a snippet of JavaScript to your pages and your clients can report their page render speed
http://blog.yottaa.com/2010/10/how-to-measure-page-load-time-with-google-analytics/
Try Google Page Speed for Firefox.
I did timings using the unix/linux command 'wget' (or 'curl'). What I would do was:
time wget 'hxxp://mycoolwebsite.com' > index.html
time curl 'hxxp://mycoolwebsite.com' > index.html
I did this for a mostly text-based web server that performed an action in php before returning a value. There are options to specify if you get the images too ( i think).
Hope this helps.
I couldn't recommend Fiddler more. While it doesn't check performance "around the world", it does make guesses based on typical latency. Plus, you get the actual load time (don't confuse this with render time) as done in an actual browser. Lots of web-based tools will download all the files for your page, but due to scripting and other things, they will miss tons. Fiddler catches everything.
there is also internetsupervision, though I'm not sure how accurate it really is.
pingdom.com has a freemium solution for this. One site for free, more sites will cost you.
You will want to use an external service for this. The service may have a Firefox plugin you can use, but ultimately you want to have your queries run from multiple controlled testing servers that are built to test your load in isolation from other variables.
The site I'm working on displays some proprietary 3rd party data that's quite valuable. As such they want to stop people copying and pasting their information. They understand that, of course, there's nothing we can do to stop users just writing down info or printing it off, but they want to make it as difficult as possible for their data to be taken. The other big concern is performance. The site sees a healthy amount of activity, so keeping it snappy is a big deal.
I was hoping to get a bit of feedback from you guys on the best way of accomplishing this
Some potential solutions that have been suggested:
Use a bit of javascript to stop users hitting ctrl / right clicking (irritating and won't stop more advanced users)
Use flex (very slow, but very safe since the data is binary)
Create or find some funky html to image converter and display the data as images
Your thoughts and opinions are very welcome.
Thanks in advance!
Charge the users for access to the information.
You can try all sorts of code workarounds, but you really aren't going to stop anyone who is determined. By charging, you limit access to people who really need the information and if they copy it, then at least you've been reimbursed. It also filters out a lot of the people who would use it maliciously. Also, put a legal notice on the information detailing how it can be used so that you can follow up copiers with legal action if necessary.
This really sounds like a serious problem with the origins of the question. If this is something that shouldn't be easy to copy, why is it visible at all?
If its really proprietary, why is it a good idea to post it on the web?
Seems that an internal webpage would be more appropriate.
It is a tricky situation, since this is the web...
You could use a very small bit of flash to display the sensitive data, which you'd have complete control over, and if it's small, shouldn't hurt your download times. This would probably be my preferred method.
Option #3 would stop people from copying and pasting, but it wouldn't stop them from downloading the image. I'm not sure if that matters to you.
Do you need to serve audiences that have javascript turned off? If not, you could use AJAX to pull the sensitive information in the first place, then use a script to stop them from copying that div or whatever.
You might want to check out Tynt Tracer. It doesn't prevent copying, but at least allows you to track where it's going...in part anyway.
You might look at the option 1, as a "bare minimum" way of doing it, but admittedly it isn't a great option, as simply disabling JS gets around it.
Your third idea would also work, but you can actually make it easier to save by going to the image and the way they are stored in temporary internet files.
Also, as a side note, to prevent printing you might want to specify a print only CSS that hides all content.
body {display:none;}
It isn't perfect, but again stops the casual user from printing.
Charging money for the content is a good answer, but I'm guessing you're already charging for the content.
#2 is clearly the most secure option, and the most flexible, allowing you to really punish yourself as much as possible as well (do things like implement over the wire encryption etc...) So it should come as no surprise it is also the most expensive to implement.
Given, someone can just decompile your code and inspect memory, but at that point, it is doubtful you are going to stop anyone.
Offer the information for download in password protected pdf, where the only thing that they can do is to view it, no printing, copy paste, etc. Although you can't stop a print screen. Primo PDF can do that for you and is free. http://www.primopdf.com/
They key here is the that effort it takes to bypass any solution you choose, is greater than the value of the information you are trying to protect from being copied.