Question

I installed google toolbar recently and used the “word translate” feature where you hover the mouse over a word (say you’re browsing the French newspaper Le Monde), and it brings up the English translation. Very cool.

But I was wondering how they actually implement this? Obviously the code (javascript?) in their toolbar plugin has to talk to a server to do the look-up. But the domain is lemonde.fr, so isn’t this a cross-domain request which isn’t possible? The toolbar works on any site so there’s no requirement for that site to have special code installed.

Or are the rules different for browser plug-in code vs. javascript embedded in the site itself?

Answer 1

Regular XMLHttpRequest between domains is blocked by the browser, but that isn’t the only wat to send a cross site request. A common way around that is JSONP, which is effectively the same as adding a script element:

<script type="text/javascript"
         src="http://google.com/translate.js?word=baguette">
</script>

That <script> tag will be requested from Google – it doesn’t require a POST, isn’t strictly AJAX, and will not be blocked. If Google returns a sensible response, you can use it. There are many other ways of communication that aren’t blocked, but JSONP is usually the most straightforward.

Even more importantly, a toolbar is a browser extension – not a web page extension. In general (unless sandboxed), it is the same as a program that runs on your computer – a toolbar can have unlimited access to the internet and to your personal files.