Cross-domain website promotion

Question

I'd like to offer a way to my users to promote my website, blog etc. on their website. I can make a banner, logo whatever that they can embed to their site, but I'd like to offer dynamic content, like "the 5 newest entry's title from my blog".

The problem is the same origin policy. I know there is a solution (and I use it): they embed a simple div and a JavaScript file. The JS makes an XmlHttpRequest to my server and gets the data as JSONP, parses the data and inserts into the div.

But is it the only way? Isn't there a better way I could do this? On the Internet there are tons of widget (or whatever, I don't know how they call...) that gain the data from another domain. How they do that?

Answer 1

You can use iFrames. but what do you mean "better way", why JS doesn't good for you?

Answer 2

A common theme of many of the solutions, instead, is getting JavaScript to call a proxy program (either on the client or the server) which, in turn, calls the web service for you.

The output can be written to the response stream and then is available, via the normal channels, such as the responseText and responseXML properties of XMLHttpRequest.

you can find more solution here :

http://developer.yahoo.com/javascript/howto-proxy.html

or here :

http://www.simple-talk.com/dotnet/asp.net/calling-cross-domain-web-services-in-ajax/

Answer 3

CORS is a different way than JSONP. Plain AJAX. All your server has to do is to set a specific header: Access-Control-Allow-Origin

More here: http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/

Answer 4

If you go the JSONP route, you will implicitly ask your users to trust you, as they will give you full access to the resources of their page (content, cookies,...). If they know that they main complain.

While if you go the iframe route there is no problems.
One famous example today of embeddable content by iframe is the Like button of facebook.

And making that server side with a proxy or other methods would be much more complex, as there are plenty of environments out there. I don't know other ways.

Answer 5

You can also set the HTTP Access-Control headers in the server side. This way you're basically controlling from the server side on whether the client who has fired the XMLHttpRequest is allowed to process the response. Any recent (and decent) webbrowser will take action accordingly.

Here's a PHP-targeted example how to set the headers accordingly.

header('Access-Control-Allow-Origin: *'); // Everone may process the response.
header('Access-Control-Max-Age: 604800'); // Client may cache this for one week.
header('Access-Control-Allow-Methods: GET, POST'); // Allowed request methods.

The key is Access-Control-Allow-Origin: *. This informs the client that requests originating from * (in fact, everywhere) is allowed to process the response. If you set it to for example Access-Control-Allow-Origin: http://example.com, then the webbrowser may only process the response when the initial page is been served from the mentioned domain.

See also:

• MDC - HTTP Access Control