How to take a screen shot of a web page?

StackOverflow https://stackoverflow.com/questions/701798

  •  22-08-2019
  •  | 
  •  

Question

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?

Was it helpful?

Solution

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)

OTHER TIPS

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.

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

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top