Plusieurs articles sont déjà disponibles sur developpez.com ou sur le Web qui traitent de l’internationalisation d’une application Web ASP.NET. Cependant, pour ASP.NET MVC, il en existe très peu, et il n’y a pas de méthode reconnue comme standard pour écrire un site multilingue avec le framework Web de Microsoft.

En me basant donc du meilleur que j’ai pu tirer de quelques articles par-ci par-là et mon expérience, j’ai mis au point une solution qui répondait à mes besoins pour une application ASP.NET MVC Razor. Cette méthode n’est pas standard, et peut-être pas la meilleure, mais elle répond pleinement aux exigences de mon projet et aux objectifs que je voulais atteindre.

Ce qu’il faut savoir sur l’internationalisation dans l’écosystème .NET

Avant de se lancer dans la création d’un site multilingue en ASP.NET, il y a un certain nombre de concepts que vous devriez au préalable savoir. Lorsqu’on parle d’internationalisation d’une application sur la plateforme .NET, cela implique la mise en œuvre de deux mécanismes principaux à savoir : la mondialisation et la localisation.

La mondialisation est le processus de conception et de développement d’un produit logiciel adapté à plusieurs cultures. Une application mondialisée prend en charge des interfaces utilisateurs localisées et des données régionales pour tous les utilisateurs. Par exemple, le format de la date en zone francophone est jj/mm/aaaa. Dans les pays anglophones, nous avons plutôt le format mm/jj/aaaa. La mondialisation va consister à afficher le bon format dans une page en fonction de la langue du navigateur d’un utilisateur ou des options choisies par celui-ci.

La localisation est le processus d’adaptation de votre application à une culture et aux paramètres régionaux donnés. Vous devez pendant cette étape, personnaliser votre application pour les cultures auxquelles vous la destinez. Cette étape doit consister essentiellement en une traduction de l’interface utilisateur vers les langues cibles.

Différentes possibilités d’internationalisation d’une application ASP.NET

Il existe sur la plateforme .NET plusieurs procédés pour rendre son site multilingue. L’internationalisation d’une application peut donc être faite en utilisant soi :

– Les fichiers de ressources ;

РDes vues diff̩rentes pour chaque culture (traduction dans le code) ;

– Des fichiers texte ;

– Utiliser à la place des fichiers de ressources une base de données ;

РOu combiner la premi̬re et la seconde m̩thode.

Chacune de ces techniques à ses avantages et ses inconvénients, et l’orientation vers l’une d’entre elles dépend aussi entre autres des spécifications de votre projet et des contraintes techniques auxquelles vous êtes confrontés. Personnellement je préfère les fichiers de ressources que j’utilise couramment lorsque je suis confronté à cette problématique.

Les fichiers ressources sont des fichiers textes optimisés. Au chargement, ils sont entièrement triés afin de limiter les accès que ce soit au niveau de la mémoire ou des différents disques.
C’est pourquoi, dans le cadre de ce tutoriel, nous nous limiterons uniquement à l’utilisation des fichiers de ressources.

Prérequis

– Visual Web Developer 2010 ;

– ASP.NET MVC 3 ;

– Connaissance de base en C# et sur le moteur de vue Razor.

Création de l’application

Nous allons commencer dès la base même, par la création d’une nouvelle application qui sera utilisée tout au long de l’article.
Pour ce faire, vous allez démarrer votre EDI Visual Studio. Cliquez sur le menu Fichier, ensuite sur la commande Nouveau projet. Dans la fenêtre qui va s’afficher, sélectionnez le Template de projet ASP.NET MVC 3 Web Application, renseignez le nom de l’application et l’emplacement ou celle-ci va être stockée et cliquez sur OK.

Sélectionnez ensuite dans la fenêtre qui va s’afficher le modèle de projet Internet Application, en vous assurant que le moteur de vue qui sera utilisé est Razor.

Cliquez ensuite sur OK pour que Visual Studio procède à la création de votre application.

Si vous exécutez l’application à ce stade, vous vous rendrez compte que le texte affiché par défaut dans vos pages est en anglais.

Puisque vous souhaitez que l’internaute qu’il soit anglophone ou francophone puissent se sentir à l’aise dans la navigation sur votre site, vous allez ajouter à celui-ci en plus du support de l’anglais, la prise en charge du français.

Pour atteindre ce résultat, les premières étapes suivantes sont nécessaires :

РCr̩ation des fichiers de ressources ;

– Modification des vues ;

РD̩finition de la culture.

Création des fichiers de ressources

Pour gérer efficacement l’internationalisation dans notre application, nous avons opté pour l’utilisation des fichiers de ressources pour stocker les valeurs qui doivent être localisées.

Ce qu’il faut savoir sur les fichiers de ressources

Une ressource est une donnée non exécutable qui est déployée logiquement avec une application. Les ressources peuvent contenir des données sous plusieurs formes, telles que des chaînes, des images ou des objets rendus persistants. Le stockage de vos données dans un fichier de ressources vous permet de changer les données sans avoir à recompiler l’intégralité de votre application.

Le format de fichier de ressources .resx se compose d’entrées XML, qui spécifient des objets et des chaînes dans des balises XML. Le .NET Framework fournit une prise en charge complète pour la création et la localisation des ressources. Ceux-ci doivent être créés d’une façon particulière pour fonctionner correctement.

Les fichiers de ressources de la langue par défaut de votre application doivent être nommés comme suit : nom_du_fichiers.resx.

Les fichiers pour les autres langues doivent suivre le format suivant : nom_du_fichier.culture.resx.

Ce qu’il faut savoir sur la culture

La culture ici doit définir le code la langue. Un code de langue est une convention symbolique permettant d’identifier une langue ou une variété dialectale ou régionale, ou un ensemble de langues par un identifiant défini dans un code, sans avoir à nommer la langue désignée elle-même.

La culture peut être neutre. Dans ce cas, elle sera codée sur deux caractères.

Exemple : en pour l’Anglais et fr pour le français.

Ou être stricte. Dans ce cas, elle sera codée sur quatre caractères ayant le format suivant « xx-XX », deux caractères minuscules pour la langue, et les deux suivantes en majuscules pour la variante régionale.

Exemple : fr-FR pour le français de France, en-US pour l’anglais des États-Unis et en-GB pour l’anglais de la Grande-Bretagne.

NB : Le fichier de ressource par défaut est utilisé si aucune culture n’est définie dans l’application ou si aucune ressource n’existe pour la culture qui a été définie.

Architecture.

Pour rester dans la logique de regroupement qu’impose ASP.NET MVC, il est préférable que l’arborescence de vos fichiers de ressources soit semblable à la capture ci-dessous :

Vous allez donc créer un dossier Ressources, en faisant un clic droit dans l’explorateur de projet et en cliquant sur Ajouter, puis en sélectionnant l’option Nouveau dossier.

Dans ce dossier vous allez procéder de même pour créer les dossiers Models, Views, etc.

Par la suite, vous devez créer les différents fichiers de ressources.
Je vous recommande de commencer par celui de la page Layout.chtml. Pour cela, vous allez créer les fichiers Layout.resx pour la langue par défaut et Layout.fr.resx pour le français.

Pour créer ces fichiers, faites un clic droit sur le sous-dossier Shared, sélectionnez l’option Ajouter, puis cliquez sur Ajouter un nouvel élément.
Dans la boite de dialogue qui va s’afficher, sélectionnez le type de fichier Ressources File, et renseignez le nom _Layout.resx dans la zone réserver à cet effet, puis cliquez sur Ajouter.

Faites de même pour créer le fichier Layout.fr.resx et les autres fichiers de ressources.

Maintenant, vous devez déplacer les textes qui sont dans votre fichier _Layout.cshtml dans le fichier de ressources, en renseignant le nom (comme celui d’une variable), la valeur (qui est le texte contenu dans le page) et une description s’il y a lieu.

Prenez la peine de vérifier que la zone « Acces Modifier » est définie à Public. Sinon, les valeurs que vous avez définies ne seront pas accessibles dans les vues.

Renseignez également la traduction de ces textes pour le fichier _Layout.fr.resx.

Attention, le nom doit être le même que celui que vous avez défini dans le fichier de ressources par défaut pour cette page.

NB : Contrairement à ASP.NET WebForms où il est conseillé de créer les fichiers de ressources dans les dossiers App_GlobalResources et App_LocalResources, avec ASP.NET MVC, l’utilisation de ces dossiers sera une source de problèmes pour vous. Je vous conseille donc d’utiliser un dossier différent (comme ce que nous avons fait plus haut), ou créer les ressources dans une librairie séparée.

Pour plus de détail sur le sujet, je vous invite à lire cet excellent billet de blog de K. Scott Allen : Resource Files and ASP.NET MVC Projects.

Modification de la vue

Maintenant que vous avez transféré le texte de la vue vers les fichiers de ressources, vous devez maintenant faire pointer les zones d’affichage de ces textes vers les ressources correspondantes.

Pour cela, ouvrez le fichier Layout.chstml et remplacez le texte suivant :

<div id="title">
   <h1>My MVC Application</h1>
</div>

Par

<div id="title">
   <h1> @MvcApplication1.Resources.Views.Shared._Layout.Title</h1>
</div>

En observant ces lignes de code, vous pouvez constater que la valeur est accessible comme une propriété de classe. En effet, toutes les ressources sont compilées vers une DLL (MvcApplication1.Resources.Views.Shared). Le nom du fichier (_Layout) est utilisé comme nom de la classe et le nom donné au texte est considéré comme celui de la propriété de la classe.

Premier aperçu

À ce stade, si tout est correct, vous pouvez déjà obtenir un premier aperçu de votre application localisée en définissant juste la culture qui est utilisée par celle-ci.

Pour cela, vous pouvez simplement définir la culture dans le fichier Globla.aspx en utilisant la méthode Application_BeginRequest qui est exécutée lors du lancement de l’application. Le code permettant de faire cela est le suivant :

protected void Application_BeginRequest(object sender, EventArgs e)
{
          
    Thread.CurrentThread.CurrentUICulture = CultureInfo.CreateSpecificCulture("fr");
} 

En modifiant le paramètre qui est passé à la fonction, CreateSpecificCulture() entre l’anglais(en) et le français(fr), on obtient le résultat suivant :

Nous avons défini une seule valeur localisée pour la vue Layout. Vous pouvez faire de même pour les autres vues.

Voilà, nous venons de finir avec les premières étapes d’internationalisation de notre application, qui nous ont permis de créer les fichiers de ressources et localiser nos vues. Dans la partie suivante, nous verrons comment procéder pour les fichiers du modèle avec les messages d’erreur de validation et comment mettre en ouvre un mécanisme de basculer entre les cultures sur l’interface utilisateur.

Lire la partie suivante : Internationalisation d’une application ASP.NET MVC 3 Razor part 2 : messages d’erreur de validation et DisplayAttribute