Cross domain content loading with javascript - javascript

Ok, here's the problem:
The remote site needs to pull complex html page content from other domain. Iframe solution is not good enough because of the problem with determining the page height, and cross domain ajax is not allowed on IE browsers. There is JSONP but amount of code that needs to be served is too complex and we also need to serve some funcionalities.
The solution:
On server side we are dinamically generating javascript that contains all the complex html content in a string variable. On remote side we just include call to this script and we put a on the page. Div is then filled with content from served variable. It works cross domain on ALL browsers and the content displays perfectly :)).
The question:
What's wrong with this approach? Why there is no mention of such solution anywhere online? It seems perfect for serving any kind of widgets and alike content, and now I'm affraid there is some big fallacy in it:)?
Please debunk it :)

There is no problem with this approach. Cross domain is forbidden on client side for security matters, but on server side you do as you wish.
The difference here is that you have to reload a page in order for it to query the other domain and then push it to your page. So basically you could do the following :
1- Your javascript does an ajax request to it's own domain.
2- On the server side, you make a cross domain request
3- You print some js/html to be used by the requester
In that scenario, you have one more request than doing it directly on the client side.

As Pointy commented, this is essentially the same as JSONP. Keep in mind that most browsers block sending cookies to the 3rd party site though.

Cross domain is possible as long as the server sends an access-control-allow-origin response header. See the linked article for an example
http://www.leggetter.co.uk/2010/03/12/making-cross-domain-javascript-requests-using-xmlhttprequest-or-xdomainrequest.html

Related

Clarification of cross-domain AJAX?

I'd like to get some clarification on what cross-domain AJAX means in terms of the mechanics behind it.
Say for example, I have a website http://www.example.com. This website contains a javascript file, which within contains several standard jQuery based AJAX calls (e.g. $.post(), $.get() etc), located at http://www.example.com/js/script.js.
Now, I have another website http://www.helloworld.com, which contains the following;
<script type="text/javascript" src="http://www.example.com/js/script.js"></script>
Would the AJAX requests within http://www.example.com/js/script.js which make requests to http://www.example.com be considered "cross-domain" and therefore carry compatibility issues when the file is included on http://www.internet.com?
Any answers would be great!
JS is executed on the client side, so it doesn't matter where the source of the file resides, it'll be executed from the domain in the address bar.
In order to be able to include a javascript from another domain, the sever that serves that JS need to provide the file with the correct headers.
In particular the headers need to have the Access-Control-Allow-Origin set for the domain requiring a cross-domain JS.
Just for test purpose you might want to run Chrome with the parameter --allow-file-access-from-files and it won't stop cross origin requests.

How to make cross domain request using ajax or javascript?

I have some Pre built script that makes some ajax request to one website. And it's working fine. But I am not able to make request to there some domains.
My working Process:-
1) I have pre built script on http://www.Test.com/a.js now i am calling this js in this domain http://www.test1.com by pasting the code to URL and it's working fine.
2) Now When I want to call one page from This http://hello.test1.com/as.php but it's showing some errors. How could i make request to subdomain page from main domain page.
Please let me know how can i do this.
Thanks in advance.
Your various options for cross-domain requests are:
The new Cross-Origin Resource Sharing (CORS) standard, if the browsers your users use support it and the server has support for it. Note that a lot of general web users still have browsers that don't support it.
JSON-P ("JSON with padding"), which is basically a dynamically-added script element
Using YQL (Yahoo Query Language) as a cross-domain proxy
There are several work arounds for cross domain scripting restrictions. easyXDM seems to do what you want.
You can use php curl to do the cross domain request using ajax. An ajax request will call php curl page which in turn will call cross domain with url specified in php curl page and return back the response .
I have implemented same and it works fine. Hope this helps Thanks.

Avoid x-domain solutions

I'm currently working on a web application that customers can add to their webpages by adding a javascript link to a js file on my server. The application read all the javascriptfiles from my sever, but I still get an error when trying to use ajax to get data from my database. I didn't think that would be a problem because the files is on my server.
Can I fix this or do I have to make a cross-browser solution? I don't have any control over the costumers server.
Thanks in advance
Mikael
This is not possible: When you execute a remote script, it runs in the context of the containing document.
There are some popular workarounds for this:
Using an iframe, which fixes the cross-domain problem but doesn't integrate well with the remote site (e.g. no custom styling)
Using JSONP to make cross-domain Ajax requests (detailed explanation here)
Using a server-side proxy script (not an option in this scenario)
Using YQL (I'm not familiar with this but it's said to work)
The same origin policy is based on the host document not the script itself.
You need to use a cross domain ajax technique.

javascript / ajax question

I'm wondering if anyone knows a javascript library where I could remotely login to a site, then browse pages upon logging in.
This is very easy with php's curl but I'm wondering if there is a javascript equivalent where I can execute multiple remote url's under a single http session.
Basically what I'm looking to do is post a username/password to one of my sites and then immediately post some other commands to a different url (same remote domain) using the authenticated session.
I haven't come across anything like this yet so I'm wondering if anyone can point me in the direction (if it's even possible). Can definitely be HTML5.
Due to same origin policy restrictions in browsers this is not possible using javascript. You need a server side script that will act as a bridge between your site and the remote sites. Then talk to this local script using AJAX.
There are some techniques available to bypass the same origin policy:
If you don't need to read the response of your POST calls, you can create a FORM by javascript with an action to any url (not limited to the same origin policy) like in this question: How do I send a cross-domain POST request via JavaScript?
But this means you rely only on session cookies for the security, this is open for XSS attacks.
As you own the other domain site, you could develop a small service that returns a JSON with the data you need, and use the JSONP technique, eg:
<script src="http://otherdomain/curl?url=page.html&callback=cb">
</script>
May be you could signin before using the POST technique above and sending a secret token that you reuse in the url to improve the security.
And finally there is a way to act/read on other pages using a bookmarklet.The idea is to inject in the other domain's page a script that can run with all the privileges, and send back information to your domain.
But this requires a manual action (click a link or a browser bookmark)

How can i get around the same origin policy?

I need to use AJAX to get the content of another page located on a different server from the one the AJAX is loaded from. The AJAX needs to send a POST request then return the result. how can i do this?
Set up proxy on your own server. Have your server call theirs and return the result.
if you control both servers, you can use one of the HTTP header fields for cross-origin resource sharing:
http://www.petefreitag.com/item/703.cfm
https://developer.mozilla.org/En/HTTP_access_control
There is no way to go around that policy. This policy is there for very good reasons.
That is also no problem as long as you're in control over the web application. You could simply redirect the call to the other server from your webserver and pass the result. This would work out like a proxy.
If you want to do that on the client and cross browser, you need some cooperation from the other server.
Either by:
1) using JSONP (inject a script tag with a callback function)
Only GET calls are possible though.
Security is an issue as the script has access to all resources in that page(data, cookies, ...).Here's a post that explain how to sandbox them and keep the data in your page safe.
2) POST looks possible using Kris Zip's window.name technique
If the cooperation from the other server is impossible, the server proxy as described in other answers is, to my knowledge, the only option left.

Categories