Cross domain / Cross browser , ajax call - javascript

Here's the scenario,
I have a main.js file in abc.com which does $.post("index.php") to access contents from the index.php from the same domain (abc.com).
This works great, as it is same domain ajax call.
But now, anyone can inlucde main.js in their website (say domain xyz.com).
Now, the path index.php (in $.post("index.php")) refers to file in domain xyz.com (not abc.com). If I put an absolute path http://www.abc.com/index.php , this does not work in some browsers (cross domain ajax restriction)
Now,
If I put headers for allow cross domain in php file, it does not work either, fails in ie 7 and below.
p.s. I need to put content in index.php file ( not in main.js ). Also, I dont want to include a php file
<script type='text/javascript' src='http://abc.com/index.php'></script>
and I would prefer not to add .js file to treat as php file in server ( so I can put php code in js file ).
The content is huge, I cannot do get request or jsonp (I think, jsonp does not allow large data)
Am I missing something ? How can I achieve this ?

You can use either JSONP or CORS to achieve this.
I've used JSONP and am going to try CORS next week. I think CORS is still asyncronous, so that might have the edge for me. At least that's my hope...

I think you need to go for server side solution. Read the file (i.e index.php) in php and save the required output to be used in a hidden field and on DOM ready You can use the data from that hidden field.

A curl request on the server side should work as well. I'd say try JSONP first, but if it wont work, go for curl request

Related

How to load website HTML using jquery

How can I load some website in my java-script so that I can parse it?
I want to get Html of e.g. www.google.com and I want to select all the tags in it using jquery.
You can't as jquery doesn't allow you to load external resources, unless in the page you want to parse is present the header:
header('Access-Control-Allow-Origin: http://thesitewhereyourjscodeishosted');
If you can't set it, you could use PHP:
<script>
var website = <?php echo file_get_contents("http://websitetoload"); ?>;
</script>
Due to browser security restrictions, Ajax requests are subjected to the same origin policy; the request can not be successfully retrieve data from a different domain, subdomain, port, or protocol.
But you can build a script on your server that requests that content or can use a proxy, then use jQuery ajax to hit the script on your server.
Working Fiddle
It's just proxying a request through Yahoo's servers and getting back a JSONP response even if the requested server doesn't support JSONP.
HTML:
<div id="example"></div>
JavaScript
$('#example').load('http://wikipedia.org');
Here is a similar question like yours Ways to circumvent the same-origin policy?
good luck!
You can easily set up node server that gets the content of the page, and then make an ajax request to your server and get whatever data you need.

Understand cross domain stuff and AJAX

I am a bit confused about 2 things related to cross domain stuff.
Say I have 2 domains; mydomain.com and otherdomain.com
Now on mydomain.com, what all are the allowed things that can be accessed from otherdomain.com ?
I mean can we have
<img src="otherdomain.com/xyz.jpg">
Similarly can we directly use otherdomain.com in iframe src ? What all are allowed by default?
What can be done to prevent access from otherdomain.com's perespective ?
2nd part is related to JavaScript/AJAX.
Is otherdomain stuff blocked by default in script related thing ?
Using AJAX, can I by default make a requst to otherdomain.com ? Is it allowed? What can be done to get response from otherdomain.com, if it is not allowed ?
Thanks a lot.
Read Wikipedia.
You cannot read from another domain (unless it allows you to).
You can display or execute content from another domain (eg, using an image, frame, or script tag), but you can't read it directly from your code.
Thus, you cannot send an AJAX request to another domain, and you cannot read the contents of an image, frame, or script tag that was loaded from another domain.
can we have <img src="otherdomain.com/xyz.jpg">
Yes we can have this and any of other resources like images, videos and audio files, zip, pdf ...
can we directly use otherdomain.com in iframe src ?
can I by default make a requst to otherdomain.com ? Is it allowed?
No. For security reasons
What can be done to get response from otherdomain.com, if it is not
allowed ?
if you own the otherdomain.com you can use jsonp and some php stuffs.
http://remysharp.com/2007/10/08/what-is-jsonp/
what all are the allowed things that can be accessed from otherdomain.com? I mean can we have <img src="otherdomain.com/xyz.jpg">
You need to distinguish between "show" and "access". You can include the image, but you cannot access it's data because of the same-origin-policy (SOP).
Similarly can we directly use otherdomain.com in iframe src? What all are allowed by default?
You can include everything that can be linked, from stylesheets, scripts, images to whole pages via frames. Executing scripts from other domains is actually a standard method for getting data, called JSONP; and including resources from third-party-CDNs is common as well.
What can be done to prevent access from otherdomain.com's perespective?
You can use the X-FRAME-OPTIONS-header to prevent inclusion via frames, which should be respected by the most browsers.
You could try to avoid answering requests (sending 404 content) with the wrong REFERER header, but that's not a reliable method since REFERER is often disabled by browsers or blocked by firewalls.
2nd part is related to JavaScript/AJAX. Is otherdomain stuff blocked by default in script related thing ? Using AJAX, can I by default make a requst to otherdomain.com ? Is it allowed?
No, the access to the data is blocked. You can send the request, but the response will not be available to your script unless CORS headers are sent to explicitly allow it.
What can be done to get response from otherdomain.com, if it is not allowed ?
You can use a proxy on mydomain.com.

How to tell Javascript loaded script src if http status code 200 or 301?

I'm trying to figure out if it's possible to create a script that will find out the user's http status code if it's 200 or 301 for a a script like this for example? Must be a user request status code and not how the server gets it :)
<script type="text/javascript"
src="https://google.com"
</script>
Is it possible?
edit: I read and researched more it might be possible with Ajax Requests?
The answer is sadly no.
In a cross-browser, end-user script (ie: one that doesn't use custom extensions/browser plug-ins), you can't read through past file requests, for HTTP-response header values.
If you make an AJAX call, you can read response headers for that particular request (not for any others).
So, in theory, if you wanted to know what the server-response was, you could make an AJAX request for the exact-same file as your script request used in its src attribute...
But not in this case.
In this case, unless your domain is google.com, your browser is going to prevent you from making that request (as AJAX calls need to happen from the same domain as the page the user is currently on) there are ways around that on newer browsers, but even in those cases, you'd need to own google.com so that your server was set to allow AJAX calls from mysite.com

Sending data to an external file via Ajax

When I use this code, it works:
ajax.open("post","a.php",true);
but when I try to send data to a external file like:
ajax.open("post","http://www.example.com/a.php",true);
it doesn't work.
Are there any solution?
The URL of the file that must be opened - the location of the server side script. This can be a absolute URL like(http://www.foo.com/bar.php) or a relative one(/bar.php). A note of caution - this URL should be in the same domain as the script is. You cannot call a script in google.com from a script that is running in yahoo.com. This is a security measure implemented in most browsers to prevent XSS.
Regards,
Cyril
On which domain is your script executed? Is it www.site.com or some other?
The reason your code might not work is because for security reasons you are not allowed to send AJAX request to other domains.
Edit: One workaround would be to implement a web service on mysite.com, send AJAX request to it. The service should then proxy the original request to othersite.com (server-side) and subsequently return the response to the script being executed on mysite.com.

Help with getting Json Format data from external website

I am trying to get Json format data from this website .. http://www.livetraffic.sg/feeds/json
however when i use ajax.. i run into this particular error in my chrome console.
Error:XMLHttpRequest cannot load. Origin null is not allowed by Access-Control-Allow-Origin.
Is the external website preventing my from using information?
Thanks for your help!!!
Sample of my code:
url = "http://www.livetraffic.sg/home2/get_erp_gantry";
$().ready(function(){
$.get(resturl, function(data) {
//do something here with data
});
});
This is your browser enforcing the same-origin policy. You are not allowed to make requests to domains other than the domain your script was fetched from.
You will have to set up some server-side proxy on the same domain as the one your script is served from and have it supply the data. (You could also cache this data on the server if it would make sense.)
You cannot make cross-domain JSON requests. Your browser will not allow it. If the target domain allows JSONP requests http://en.wikipedia.org/wiki/JSONP#JSONP then you'll be able to use this work-around instead. Else you'll have to make the request server-side.
Simpler you can perform an ajax query to a local php page which contains
header("Content-type: application/json; charset=utf-8");
echo file_get_contents('http://www.livetraffic.sg/home2/get_erp_gantry');
You just must have allow_url_fopen true.
Thanks All! Manage to pull down the Json data from external website using a server side PHP script and then passing variables to my javascript :)

Categories

Resources