I'm building a web application using a lot of javascript and AJAX. This app has to be multilingual.
On the server side, I have a little template-engine coded in PHP which handles translation files. But on the client side, I sometimes display text and I need to translate it following the same rules. I do not want to make an http request every time I need to display a message, so what is the best way to do it?
In other words, how to build an unified translation system working both server and client side?
You could setup a server side script which will serve dynamic javascript containing the translated variables according to the user preferences. For example:
<script type="text/javascript" src="/translations.php?language=fr"></script>
This script could contain a global variable with the translations:
var values = { hello: 'Bonjour', goodbye: 'Au revoir' };
...
The script will be cached by client browsers and used in your scripts:
alert(values.hello);
Just make sure you setup proper HTTP response cache headers so that the clients need to fetch those values only once, probably when choosing a language. Obviously the server side script could also use the Accept-Language HTTP request header to determine the client preferences instead of a query string parameter.