I want to take a screenshot from my website of another website or preferable 1 part of it (an object tag).
I want it to work this way: I click on a button that will send a request to screenshot the page at this moment. Several ideas are insert the page inside a flash object and screenshot it. Or opening a browser on the server and when I click the button send a request using AJAX to tell the server to screenshot with this browser.
How should I do this because I kind of failing right now with the flash Idea. The page I am trying to screenshot is a live camera that uses a .wvx object. But I can't even do that with a .swf object.
Thanks!
You can try phantomjs. They have several examples of renderding page output. It supports plugins like flash too.
render() always renders the entire page. To just render one <object> tag, I guess you can do one of:
create a page that only contains that <object> tag.
use javascript to remove everything else.
crop the final screenshot based on <object> page coordinates.
To use phantomjs from php, try php-PhantomjsRunner.
Edit 1: In case you only want to render a flash file that does not actually rely on the web page it is in, you can try Gnash according to the blog post "Server-side PNG rendering of SWF images using Gnash" by Valentine Bichkovsky.
phantomjs screen-scraping
Related
I need to display a loading graphic (whilst sql query runs) during the loading of an asp page.
Have set a graphic to show (animated gif) which shows via response.flush() just after the graphic is referenced and hides via javascipt onload.
All work perfectly except that my AVG antivirus setup (and therefore I expect most others') gets in the way of the buffer flush as presumably it is analyzing the stream of html/javascript, so the page just loads as one lump.
Any thoughts? (or perhaps another way of doing this via classic asp/javascipt?)
Many thanks
you may want to have a look at the following related questions:
Loading screen in classic ASP page
show loading message while loading contents in asp using jquery ajax
This is not about loading Facebook asynchronously or any kind of optimization here but to load it as fast as possible rather than as slow as possible ;)
My website contains a LOT of images. And I need the Facebook Like button to show up as soon as possible. But it seems the button doesn't load: it waits for all the images to be loaded before loading itself. Since I have many images, of course the Like button shows up very late. If the connection is really slow, that might even take one minute. You can see the issue here: http://www.totorotimes.com.
Any idea how I could do this?
Thanks a lot!
Take all the javascript code that is for the social media buttons out of your body tags, put them in a file called: "social.js" and then insert that file right above all the js files in yourhead tag. This will make your buttons load before the actual web page loads.
I am trying to load a webpage then insert my own Javascript into it.
I have the current code here:
window.location.assign('http://http://79.170.44.75/hostdoctordemo.co.uk/downloads/vpn/index.php');
document.getElementById('address_box').value = prompt("Site Address: ");
document.getElementById('go').click();
and what I am trying to do is:
Load the webpage
Set the address box to a value
Simulate a mouse click on the search button
So it loads the webpage, then searches a value it sets itself.
The problem with my current JavaScript is that as soon as the webpage has loaded the JavaScript stops working (as I expected). I have tried using the iframe tag to load the webpage 'within the webpage' but that did not work when obtaining the id and people said iframe would also not work because of the resolution difference.
**The Question: ** How do I load a webpage and run my own JavaScript code on it? Thank you!
Matthew
You're propably looking for something like Greasemonkey.
I really can't see an easy way to do what you want.
When the browser receives a web page from a server the javascript is interpreted, and only after that, the page is presented on the screen.
So you would have to have a web page with a button or other mechanism to make a request to a web server, receive the request, save its contents locally, add your javascript code and only then "give it to the browser".
I'm building a social bookmarking application for use within large companies.
It has a simple JavaScript bookmarklet which currently works fine - the bookmarklet allowes users to save a bookmark from popular browsers. It works for public web links quite well - and is fairly browser-agnostic. The closest example of such a bookmarklet is this:
http://delicious.com/help/bookmarklets
When I am viewing a PDF in my browser (let's say Chrome/Mac):
http://website.com/file.pdf
This does not work of course - since there is no way to inject HTML markup on top of a PDF being viewed in-browser.
What is the best approach to making links to non-http resources work within a bookmarklet? Do I have to create then inject some kind of invisible iframe and then grab a parent frame and it's URL to be able to save it?
I don't know about all browsers, but in Firefox you can inject Javascript and iFrames over PDF files and images. This is because images and PDF files are actually displayed inside special dummy HTML pages generated by Firefox. I think Chrome may be the same.
You can see this for yourself by opening a PDF or image and then opening the Web Console (must use menu, can not use CTRL+SHIFT+K in this case) to get the JS console and then type document.documentElement.outerHTML to see the actual dummy HTML where the PDF or image is embedded.
To detect situations where I can not add an iFrame or other HTML to a page, I might test if document.documentElement is defined, or possibly some other DOM element.
For any browser or file-type combination where this will not work, or if I just wanted to keep things more simple, I'd open a page on my server in a new tab or window and pass the page title and location to that page like http://mysocialsite.tld/add-bookmark?title=file.pdf&location=http://anothersite.tld/file.pdf. That page on my server would let the user complete the bookmarking process.
I am looking for a way to, give a URL, get the source of a webpage back after the JavaScript has been run on it. For example:
I have a webpage with a .
On loading the page, some JavaScript populates the div.
Viewing the source of the page through a browser will not give the information which is within the div.
As far as I know, in order for the browser to render the page the div must have been filled with (X|D)HTML which would mean that the source of the page after being rendered is still just nested markup, so theoretically there should be a "final" version of the page source.
I have considered using a rendering engine like WebKit or Gecko and somehow adapting these to do this, however this is a fairly large task and I don't really want to duplicate something which has already been done. Does anyone know of a way of performing this task.
Regards.
Update: I am aiming to use Selenium (as mentioned in the comments to the accepted answer) to do this automatically for several pages. My project is a web spider which by design needs to target a number of pages in which the content I am aiming to reach is not available until after the JavaScript has populated everything.
Such addons for Firefox as the WebDev toolbar, or Firebug have options like 'View generated source'.
As far as timing it goes, just about the only option you have is to have a snippet of javascript code. You could set a start-time as soon as is possible on the page-load, and check again when the page is completed (either for dom-ready or page completely downloaded). It's going to be highly variable however, and if you are trying to time it in order to improve the speed (which is good to know, and to do) - just getting Firebug + Yslow would be far more useful.
Within Firefox you can get the final rendered DIV by waiting the browser to finish rendering, then pressing ctrl-A to select all content on the page and finally selecting "Show selection source" from the right-click menu.
This shows you the manipulated/populated DOM-code of the page.