Html thumbnails - javascript

When we open a new tab in google chrome it shows thumbnails as this.
. Is there a way that I can also use this thumbnail facility on my html webpage such that I just pass the url's of various sites and it shows in the same manner. I can not use fixed images as the content on the websites (I wish to display as thumbnails) keeps on changing.

While it is possible to get a screenshot of a page with client side code, the Same Origin Policy will prevent you from doing it to arbitrary third party sites.
You would need to look for a server side solution to generate your screenshots. There are several tools that could help (PhantomJS and Selenium spring to mind). You would need to write a web server that you could use to pass a URL over and get a screenshot back.

If you are using WordPress, there is some information about it here
There is a plugin to download, but there is also a code example.

Related

Questions about turning the HTML code that uses Cytoscape.js into a web link accessible by other people

I am able to use the Cytoscape.js library to display a network graph on my own web browser. I wrote a HTML file containing the JavaScript code that takes in the graph JSON and style JSON files from my laptop and calls cytoscape(). When I run my HTML code on my laptop, the network graph is displayed on my own web browser and I can play with the graph.
Now I need to run the HTML code on our Linux server and then send a web link to the user, so that the user can click on that web link to view the displayed network graph on their own web browser, and the user should also be able to move nodes & edges around just as I did on my own web browser.
I am not a web developer so I am missing some very basic knowledge. I think I probably need to link the HTML code to a web domain (deploying the HTML code on a hosting server with domain name). I was just wondering if you could offer me some advice on how to do this?
Another question (which is more important) is: Assume I am able to link the HTML code to a web domain. When the user clicks on the web link to view the displayed network graph on their own web browser, is the user still able to move nodes & edges around?
The graph JSON and style JSON files and some additional JavaScript code the HTML loads in reside on our server. I am not sure if there are any issues about this when the user accesses the web link?
Any advice would be greatly appreciated.
Thank you very much in advance!
The question is too broad. You'd be best off searching for some books to read regarding web dev.
You might find using Github pages a bit easier than managing your own server, but you really should do some reading either way.
Basic resources to get started
https://developer.mozilla.org/en-US/docs/Web/Guide/Introduction_to_Web_development
https://developer.mozilla.org/en-US/docs/Learn/Server-side/First_steps/Introduction

a website preview - loading a webpage using javascript Or Server-side

I want to show website preview on a link similar to facebook when a user post a link. my question has been repeated in the following link ,but I am going to ask specific information throughout my solutions. I have 2 solutions for showing webpage preview which are as follows:1. server side html process 2. client side html process.
1. server-side html process
I used System.Net.WebClient().DownloadString(url) to retrieve the web page data in server side , and I tried to extract the most important information in the page ,but in most cases, main part of the page loads using javascript , therefore I do not have access to that information.
Another solution in server-side html process is to work with webBrowser and WebDocument objects. because I didn't work with these libraries and I don't know how much the Web server performance affect by applying this objects , I only present this solution for discussion .Therefore are there any server-side html graber which fetch all html data including javascript loaded html source?
2. Client Side Html process
The simplest approach for client side is to use the iframe tag, but it has two following problems:
a. I can not access to innerHTML of the frame for the links on other domains.
b. I can not load https webpages such as drop-box and facebook in the iframe
because of "x-frame options" error.
My question is that, is there any other client-side solution to retrieve dynamic html source(loaded by javascript) from 3rd party webpages (usually https)? Or can I solve above problems with some tricks.
I guess server side approach would be most viable option. On client side you can use proxy services which allow to solve cross domain limitation, for example, crossorigin.
To generate a preview, similar to one Facebook provides, you need to get Open Graph information for target page. Libraries to process open graph data available for multiple platforms. OpenGraph-Net could be used on .NET plarform.

Can I grab specific page HTML code from another webpage through Javascript?

I've read about how there are multiple methods to grabbing source code from another webpage via jQuery or using Cross-Domain Requests. What I want to try and do is make it so I grab a div that has different code each time a page is loaded and not the source code as a whole. So for example, the greater detail you see when you use 'inspect element' or a tool like firebug to dive deeper into the page code.
Would I be using one of the same methods?
Yes.
If you control BOTH domains you can add the Access_control_CORS
header to allow access of cross domain requests and use a
headless browser like phantomJS to grab a cached version of
rendered HTML page.
If you don't control both domains you will have to write a server
side proxy to grab the page and all its resources (you will have
to parse the page to get or rewrite links to images, javascripts,
stylesheets etc...) then run it through phantomJS to create a
HTML snapshot.`
source:
https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy
https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
http://phantomjs.org/
NOTE: despite my best efforts, stack overflow is absolutely convinced these links are code. Sorry for posting as code.

Advert javascript not being served correctly to the browser unless called directly?

I hope this is the right place to ask this question - I did have a look at the rest of the sites in the network but this looked like the most appropriate place.
We are having issues serving third party adverts on our websites. For various reasons our ad setup is a bit complicated - we serve third party javascript tags (AppNexus) through our own ad server (OpenX) through iframes. Currently, the third party javascript tags are not showing correctly, although they have worked just fine in the past.
Debugging this in Safari I have discovered a few things which seem to me to be a bit unusual, and I'm struggling to work out what's going on. Using the web inspector to check the third party's javascript, it appears in the web inspector as a blank file. Additionally, if I check the network tab, the headers are shown and look fine, but there is no 'content' tab with which to check the returned content. The network tab shows the request for the file as complete, and with suitable status codes (200/302):
http://cl.ly/401C1D3Y3u2G2k2k3s0x
However, if I load the file directly in the web browser, it loads fine:
http://ib.adnxs.com/ttj?id=694021&cb=[CACHEBUSTER]&pubclick=[INSERT_CLICK_TAG]
FWIW, the javascript file uses document.write to spit out either an image or another iframe. It's also worth mentioning that there are no related errors in the console - there is one relating to Google Ads, but the problem persists if I load the Ad server's iframe directly without the rest of the site.
Has anyone seen this behaviour before, where a file loads just fine directly, but is (blank / not retrieved / not parsed / whatever's going on) when called as part of another page? If so, would you be able to help me fix this?
Thanks in advance for any help you can give me - I hope this makes some sense and will be happy to provide any further information that might help me get to the bottom of this!
Ollie
I'm guessing that the third party site is filtering output from their servers based on the HTTP referer being sent in the request (a technique employed by many web hosts to thwart hot-linking content). Try putting the link to the javascript file in a clickable link on a web page on your server and click it and then see if it loads or if you get a blank page. You could also try loading a browser extension which lets you forge the HTTP Referer (such as RefControl for Firefox) and then change your refer to be your site instead of the third party's and try pasting in the URL to the browser and see if it loads.
This isn't your fault if it's what turns out to be the actual problem. It's up to the third party to configure their web host to allow for this.

Display a podcast from a sub-domain

first time poster here so I hope I am doing this correctly. I have been contracted by my church to redesign their website. (They've been dealing with a table layout for years.)
I am looking to display an RSS feed (with an audio file) on my website. I am unable to use PHP or any other server-side language, it has to be done in JavaScript.
Due to the way our hosting is set up, all images and xml files are hosted on
images.(mydomainname).com
and the page on which I looking to display the podcast is
(mydomainname).com/sermons
as such, I have run into the problem of being unable to access the xml file with JavaScript. For all the Googling I've done, it seems that my GoogleFu has failed me. Any tips would be greatly appreciated.
If you have the ability to drop another static file on your images domain, then I'd suggest EasyXDM. It's a cross-browser library which provides an a way to communicate (using only client script) between different domains. Caveat: you need to have control over both domains in order to make it work (where "control" means you can place static files on both of them).

Categories