Laravel - Créer un site multilingue

Il peut s'avérer nécessaire de fournir un site en plusieurs langues. Laravel nous fournit plusieurs outils qui nous permettront d'y parvenir.

Il est important de noter que la traduction simple ne suffit généralement pas, il faudra plutôt parler de localisation, qui est plus pointue puisqu'elle adapte le langage utilisé au contexte culturel de la population ciblée.

Dans cet article, je vais traiter uniquement de la partie traduction.

Définir la langue par défaut de Laravel

Nous allons nous assurer que la langue par défaut de Laravel est bien celle que nous souhaitons utiliser.

Pour ce faire, nous allons ouvrir le fichier config/app.php et modifier le paramètre ci-dessous.

 
    /*
    |--------------------------------------------------------------------------
    | Application Locale Configuration
    |--------------------------------------------------------------------------
    |
    | The application locale determines the default locale that will be used
    | by the translation service provider. You are free to set this value
    | to any of the locales which will be supported by the application.
    |
    */
 
    'locale' => 'fr',
 
 

Dans l'exemple ci-dessus, le site considérera le français comme langue par défaut.

Les fichiers de traduction

Avant de mettre en place la traduction, il sera nécessaire de nous assurer que nous disposons des fichiers de traduction dans les langues ciblées.

Le Français (dans notre exemple) sera directement écrit dans les vues.

Les autres langues devront fournir la traduction des textes sous la forme d'un fichier json qui se situera dans resources/lang.

Il sera nommé en fonction de la langue cible, ainsi la traduction Anglaise sera dans un fichier en.json.

La structure du fichier sera la suivante

{
    "Accueil": "Home",
    "Proposer": "Submit",
    "Liste": "List",
    "Contact": "Contact"
}

Routes et contrôleur

Afin de pouvoir connaître la langue choisie et la modifier, nous allons créer des routes et un contrôleur de localization.

Le contrôleur

Nous allons créer le contrôleur en exécutant la commande suivante

php artisan make:controller LocalizationController

Nous obtiendrons le fichier suivant

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class LocalizationController extends Controller
{
    //
}

Dans ce fichier nous allons créer 2 méthodes, l'une pour obtenir la langue active, l'autre pour modifier la langue.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class LocalizationController extends Controller
{
    public function getLang() {
        return \App::getLocale();
    });

    public function setLang($lang){
        \Session::put('lang', $lang);
        return redirect()->back();
    }
}

Les routes

Une fois ces méthodes existantes, nous pouvons les appeler depuis nos routes.

Nous allons donc ajouter 2 routes à routes/web.php.

// Route qui permet de connaître la langue active
Route::get('locale', 'LocalizationController@getLang')->name('getlang');

// Route qui permet de modifier la langue
Route::get('locale/{lang}', 'LocalizationController@setLang')->name('setlang');

Le middleware

Afin d'effectuer la gestion des langues, nous avons enfin besoin d'un middleware.

Pour le créer, exécuter la commande suivante

php artisan make:middleware Localization

Vous obtiendrez le fichier Localization.php dans app/Http/Middleware, nous allons le modifier comme suit

<?php
 
namespace App\Http\Middleware;
 
use Closure;
 
class Localization
{
    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    {
        if ( \Session::has('lang')) {
            // Récupération de la 'lang' dans Session et activation
            \App::setLocale(\Session::get('lang'));
        }
 
        return $next($request);
    }
}

Après avoir créé le middleware, il ne faut pas oublier de l'ajouter dans app/Http/Kernel.php

    /**
     * The application's route middleware groups.
     *
     * @var array
     */
    protected $middlewareGroups = [
        'web' => [
            \App\Http\Middleware\EncryptCookies::class,
            \Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse::class,
            \Illuminate\Session\Middleware\StartSession::class,
            // \Illuminate\Session\Middleware\AuthenticateSession::class,
            \Illuminate\View\Middleware\ShareErrorsFromSession::class,
            \App\Http\Middleware\VerifyCsrfToken::class,
            \Illuminate\Routing\Middleware\SubstituteBindings::class,
            \App\Http\Middleware\Localization::class,
 
        ],

Utilisation

Une fois tout ceci fait, nous sommes prêts à utiliser le système.

Afin de modifier la langue, il suffira d'appeler la route comme ceci

<a href="locale/en">English</a>

Pour insérer dans le html une chaîne de caractères à traduite, elle s'écrira comme ceci

<!-- Cette ligne affichera "Accueil" en Français et "Home" en Anglais -->
<p>{{ __("Accueil") }}</p>

Voilà qui devrait être fonctionnel.

Obtenir de l'aide

Pour obtenir de l'aide, vous pouvez accéder au serveur Discord pour une entraide par chat