Show external website in my aspx page and include own javascript - javascript

What I am trying to accomplish:
A visitor of my website should be able to load an external website into my website and click elements on this external websites to retrieve the XPath of the element. Like Firebug but completly online.
I have already managed to create a piece of javascript to click elements on MY website and return the XPath of the element.
Now I need to know how to show an external website in my ASP.NET WebForms page and inject my own javascript.
I tried to use a literal control and download the external website's HTML code with a WebClient.
WebClient webClient = new WebClient();
string result = webClient.DownloadString(txtURL.Text);
litWebsite.Text = result;
Problem here is: The the external website's design will be broken if I don't consider the CSS references.
Maybe this is a complete wrong approach.
Any ideas?
Thank you!

I'm not sure it's possible.
Sure, you could display the web page via iframe but unless you owned the content, I'm not sure you can control it with your own javascript.
Maybe I'm wrong but I've always heard that your could do very little with other web content in your own project.

Related

What is the best way to display webpage content for a given URL using javascript?

I am developing a small labeling tool that given a URL should display a document hosted on that URL and allow a user to choose a label for that document.
I want to display the contents of the URL for this purpose. As far as I know, I can either get the URL content, parse the contents, and display or use an iframe option.
Without using parser
Iframes are not enabled for the target URL, the contents of which I want to display. Is there any other way to do this using javascript without using parser?
Using parser
I can crawl the contents of the URL, get everything between and dump it in the webpage area.
I'm new to javascript and front end development so I am not sure whether these are the only options.
Are there other options to do this?
If the parser is the only option, Can I dump the HTML that I get from the remote URL? I understand that images and other media that may be within on remote url won't be displayed. Is there any other caveat to this method? More importantly, Is this the best way to do this?
Most sites do it via the iframe like you mentioned like codepen.
Also, you can use Puppeteer ( a headless browser ) to do these sort of things. Get the contents using web scraping or take a screenshot or print a pdf. Pretty nifty library.
Most things that you can do manually in the browser can be done using
Puppeteer! Here are a few examples to get you started:
Generate screenshots and PDFs of pages. Crawl a SPA (Single-Page Application) and generate pre-rendered content (i.e. "SSR"
(Server-Side Rendering)).
Automate form submission, UI testing, keyboard input, etc. Create an up-to-date, automated testing environment.
Run your tests directly in the latest version of Chrome using the latest JavaScript and browser features.
Hope this helps !

Loading the html of a different website

I'm looking to get some data from a Facebook page of a restaurant, but I'm kinda stuck. I want to load some divs from the facebook page of the restaurant, then get the ID's of the divs, since they contain some information i would like to use. Ive tried using the .load function from jQuery, but no luck. Of all the answers I've seen, they all include a url that's something like somefile.html. Is it possible to load the divs ids and some innerHTML from a live page like Facebook? Are they somehow downloading the html to a file then using that? Keep in mind I know nothing about PHP, so any solutions? Thanks!
The right way to do it would be though Facebooks graph API, take a look at this site and see if it offers the information you need https://developers.facebook.com/docs/graph-api/reference/page/
NOTE
As comments have pointed out, "web scraping" is FORBIDDEN on Facebook.com by Facebook policy. http://www.facebook.com/apps/site_scraping_tos_terms.php
Technically, I don't think this is possible with Facebook and just JavaScript.
In general, using just JavaScript, one solution would be to load the (external) site like FaceBook into an Iframe, and then grab all the DIVs and search the DOM that's loaded into the iFrame. However, I believe FaceBook (and other sites) set something called "CORS Request Headers" which prevent the page from loading into an iFrame -- also, as far as I know, this cannot be hacked around except to use another language to pull the HTML as a file (like with PHP).
Sources:
Facebook Forbids iFrames
JavaScript, Load Page in iFrame

How to load entire website (external link) with functionality on my webpage?

I want to integrate this external example link on my web page. I am using PHP scripting language.
I have used file_get_contents, wget and all things but its only get HTML content.
I want to load entire site on my webpage. I don't want to use Iframe and tags because of security purpose I cant share URL with Users.
So please give me advice on this.
Is this we can do like how the proxy site works? Please help me on this.
Thanks in advance. :)

C# Collecting data from website after scripts are loaded

I want to download some code from an HTML website but the data that I need appears after the JavaScript loads (as i know). I tried WebClient but this gets only the HTML code without any JS changes and as far I know there is nothing more I can do. Now I'm trying WebBrowser in WPF and Forms. I have WebBrowser control and I'm navigating to my url address but I'm getting JS errors and scripts are still not loading.
webBrowser1.Navigate(new Uri("http://www.polskieszlaki.pl/atrakcje/woj-slaskie/"));
How to get webpage fully loaded with all scripts?
Btw. I don't need a web browser, I just need to collect some data so the HTML code after scripts are loaded is enough for me.

Populate DIV dynamically from external Javascript using data from database

I am developing a plugin for displaying a list of images in others' website. I intend to provide them only one url (probably a JS link) which they need to embed in their site so that they will see those images. These list of images would come from my database. Can you please tell me if such a functionality is achievable using Javascript?
Thanks,
Sachin
Javascript is client only and for those security reasons you cannot and should not connect to a database from js. What you can do is use a webpage to produce those images and use your script to inject the page into their sites. You can do this via an iframe or an object tag.

Categories

Resources