Localization: Php and Javascript

Question

I'm thinking of the best way to localize my website. I am using Laravel, which already has a php localization class, but I will also need to translate some javascript strings

Ideally, I would use a library or translation file which could be editable through Poedit and could used for both javascript and php, but I can't find a solution for that. Is it even possible without having to create a whole new code library?

The solution I thought of until now is far from ideal:

• Use a php localization class for php strings
• Use a javascript localization library for javascript
• Store the language in a cookie which could be read by both ends.

The idea of keeping two separate language files (one for php and one for javascript) does not seem like an elegant solution.

I saw some javascript libraries for laravel, but they require you to compile your library into a javascript array file every time you update something, which would make it not very dynamic and also redundant, since most php strings won't be used in javascript and vice-versa.

Any thoughts on this?

Answer 1

You could always have your Javascript files be PHP generated per request, which would mean you could still use the PHP localization library for both.

I would imagine that this might not play very nice for caching the javascript files in browser, but you could always have a PHP script that generates the javascript files, creating a different file per language, then any time you need to update them, just run the PHP script again to overwrite them

I have never worked on localization, but I imagine it involves a file which matches words/phrases for each language? If so, you could set up a cron job that checks the last time this file was updated, which then runs the PHP script to generate the Javascript files? Then you won't have to worry about running it manually each time

Answer 2

We've been facing this issue for a while. If you search on Github, you will find some projects around there, but any of these solve the problem, and as you said maintain two files is not a good option at all. So, the ways we found to solve this issue are:

1. On each page, declare a variable on javascript, that you will set with php, and in this way it will be available also on JS side. It is not yet elegant at all, but solves the issue. So it would be something like this:

   /**
    * i18n for JS
    */
   
   var i18n = (function() {
     return {
       stringOne: "{{trans('yourStringOneKeyFromPhp')}}",
       stringTwo: "{{trans('yourStringTwoKeyFromPhp')}}"
     }
   }());
   

2. On the other side, a better solution would be as Adi was pointing out, by creating fake views that in reality are served as javascript files, in which you will solve the i18n variables on a controller. This is a more elegant solution, but it goes against caching, so I suppose it's a matter of trade-off, which way you choose to implement. Maybe, a good way would be to use this plugin, and update the json files, as explained before.

Answer 3

For small to med size websites I would create a translations table such as

table: translations
en_gb, de, fr
--------------------------------
Text, Text (in de), Text (in fr)

Then you would identify through your url the current locale and get the data only for the current locale, e.g.

if locale == de, get en_gb and de fields.

Then build your array:

$translations = ['en_gb' => 'de'];

Once you've got the array you can translate any static content via php.

Now you can pass your array to javascript

var translations = json_encode($translations);

Now you will also have a javascript object which you can access: translations['English text'] will return the de translation.

You will only query the database once at page load/refresh, and the tables will make it easy to maintain.