Is it possible to load an external website using .load function?
<div id="new"></div>
<script language="JavaScript">
$(document).ready(function(){
$("#new").load("http://omn.orgfree.com/");
})
</script>
Thanks!
Due to browser's same origin restrictions, you cannot load content with ajax from other domains.
You could display that content in an iframe or you could use a server proxy in your own domain to fetch the content for you.
It depends on your expectations. If you want to maintain the capability to traverse and manipulate DOM of the loaded page, then the short answer is "no" due to cross-domain security policies.
You could still commonly integrate the content by using an iframe or a more compliant <object data="http://omn.orgfree.com/" type="text/html" />, and there are protocols like window.postMessage allowing client-side cross-domain communication. Integration has to be done by both parties though.
Again, assuming that the other party is available to assist with integration or you have direct control over the other domain's content, you could use JSONP with ajax requests - technically any html could be serialized that way.
I don't think so. User can load only those web pages that are within its directory.
However this feature can be achieved through server side methods(in case of c#).
Related
I used a iframe to load a external sites but some of the sites are not load due to a security header x-frame-options:[deny/sameorigin] .
Is there any alternative way to load any external sites in our app.
In a single sentence, it is impossible to make it work with all the external sites within your html using security compliant browsers.
You can try calling an ajax call, get data and use innerHTML to upload content. But it requires CORS enabled on the external site and also actions might not work as you only load html content. Angular might block innerHTML, you might need to relax that exception as well in angular.
I want to get the XPATH of an element on a website (my own domain), which I got it using JavaScript code as mentioned in this answer.
Now what I want to click on button which will open a url (cross domain) window and when user click on an element on that window it's XPATH is captured.
I tried doing the same using iframe with no luck.
Now my question is there a way to get the XPATH of an element of another website/ Cross domain?
Sorry this is not possible without cooperation from the other (x-domain) site. Browsers are designed not to allow access to the DOM of x-domain documents (iframe included) for security reasons.
If you had cooperation from the other site, they could load your javascript file and then use postmessage to pass the xpath to the original page.
Other options would be to create a bookmarklet users could use on the other page, or a browser extension (Chrome and FF are pretty easy to develop for)... depends on your use case.
From your comments, I've gathered that you want to capture information from another website that doesn't have Access-Control-Allow-Origin headers that include your domain (e.g. the other site does not have CORS enabled). This is not possible to do cross-domain and client-side due to the Same-Origin Policy implemented in most modern browsers. The Same-Origin Policy prevents any resources on your site from interacting with resources on any other site (unless the other site explicitly shares them with your site using the Access-Control-Allow-Origin HTTP header).
If you want to get information about another site from your site, there is no way around using server-side code. A simple solution would be to implement a server-side proxy that re-serves off-site pages from your own origin, so the Same-Origin Policy will not be violated.
You may get the data using jQuery's load function, and append it to your page.
From there, the DOM nodes from your external page should be accessible for your processing.
$('#where-you-want').load('//example.com body', function() {
console.log($('#where-you-want'))
// process the DOM node under `#where-you-want` here with XPath.
})
You can see this in action here: http://jsfiddle.net/xsvkdugo/
P.S.: this assumes you are working with a CORS-enabled site.
Is it possible to get <div> Content from a another Site and put it with JS in the currect Site?
Example:
Website 1 have a Portal and want include Content from Website 2.
Website 2 have in <div id="content"></div> the required Content.
Website 1 will get the Content with JS and put it into <div id="content_here"></div>
No, this is not possible via javascript. Any request made via javascript must made be to the same domain as the originator. This is a security feature of most browsers known as the Same Origin Policy.
The only work-around is to scrape the source of the external domain via a server-side language, such as PHP or ASP.Net and then make the AJAX request to that locally.
IF website1 & website2 from maches the same origin policy then you can access the Iframe from the JS, if you have access to both of the websites you can pass the origin policy by using JSONP for example appendHtml(html) otherwise no you cant (as fast ideas came into my mind)
hope this helps,
I want to load a whole site into a div. When I use
$(document).ready(function(){
$('#result').load('http://www.yahoo.com');
});
It's not working.
It will be a cross domain call to do using javascript. You can use iframe to load.
Check this link for possible solutions.
This is a cross-domain issue.
You can create a proxy on your server to fetch the data and you'll load it from your own domain.
What do you mean "a whole site", if you mean a given page, then it'll probably require all manner of header included files, which are not suitable to go in to the body of your page.
You would need to use an IFRAME, just create the IFRAME element and set the source to the URL you want.
Although I'm not sure about your use case of loading "whole" site into div - you are limited by "same domain" security policy, in order to make cross-domain AJAX calls you need to employ JSONP call http://api.jquery.com/jQuery.getJSON/
You can't do that unless the content you're loading comes from the same domain as the site you're loading it into, due to JavaScript's Same Origin Policy.
Your alternatives:
load the content into an iframe
pull the content server-side via an HTTP get, and the write it out to your page
Beware of licensing issues with the second option if you don't have permission to use the content, though!
Is it possible to read and parse the dom elements of third party websites like cnn.com (for e.g) so that I can get the div, a, p tags and read the position and size information?
jquery can parse and show information of the web page where your javascript code is running but if we provide an external web page to the .load command, can we parse the third party website page and read the DOM tree?
Thank you
No, you will be blocked by the Same Origin Policy, which restricts one site from accessing another on a different domain. You could set up a server-side script, in your preferred language, which would fetch the website on behalf of your JavaScript code, but this is more complex than just using AJAX to request the page.
I think you cannot access other domains' content with javascript due to security reasons. At least in secure browsers...