41 votes

Localiser les chaînes en Javascript

J'utilise actuellement des fichiers .resx pour gérer mes ressources côté serveur pour .NET.

l'application que je traite permet également aux développeurs de brancher JavaScript dans divers gestionnaires d'événements pour la validation côté client, etc. Quel est le meilleur moyen pour moi de localiser mes messages JavaScript et mes chaînes?

Idéalement, j'aimerais stocker les chaînes dans les fichiers .resx afin de les conserver avec le reste des ressources localisées.

Je suis ouvert aux suggestions.

27voto

Joel Anair Points 8561

Un objet JavaScript de base est un tableau associatif, il peut donc être facilement utilisé pour stocker des paires clé / valeur. Donc, en utilisant JSON , vous pouvez créer un objet pour chaque chaîne à localiser comme ceci:

 var localizedStrings={
    confirmMessage:{
        'en/US':'Are you sure?',
        'fr/FR':'Est-ce que vous êtes certain?',
        ...
    },

    ...
}
 

Ensuite, vous pouvez obtenir la version locale de chaque chaîne comme ceci:

 var locale='en/US';
var confirm=localizedStrings['confirmMessage'][locale];
 

10voto

Leniel Macaferi Points 38324

Après Googler beaucoup et n'est pas satisfait avec la plupart des solutions présentées, j'ai juste trouvé une incroyable/solution générique qui utilise les modèles de T4. Le poste complet par Jochen van Wylick , vous pouvez lire ici:

À l'aide de T4 pour la localisation de JavaScript des ressources sur la base .fichiers resx

Les principaux avantages sont:

  1. Avoir 1 seul endroit où les ressources sont gérées ( à savoir l' .resx les fichiers )
  2. Prise en charge de plusieurs cultures
  3. L'effet de levier IntelliSense - permettre l'exécution de code

Inconvénients:

Les inconvénients de cette solution sont bien sûr que la taille de la .fichier js peut devenir très grand. Cependant, puisqu'il est mis en cache par le navigateur, nous n'avons pas, c'est un problème pour notre application. Cependant - cette mise en cache peuvent également apparaître dans le navigateur de ne pas trouver de la ressource appelée à partir du code.


Comment cela fonctionne?

Fondamentalement, il a défini un modèle T4 qui pointe vers votre .fichiers resx. Avec un code C# il traverse chaque et chaque chaîne de ressource et de l'ajouter à JavaScript pur valeur de la clé de propriétés qui sont ensuite sortie en un seul fichier JavaScript appelé Resources.js (vous pouvez modifier le nom si vous le souhaitez).


Modèle T4 [ modifier en conséquence pour pointer vers votre .fichiers resx emplacement ]

<#@ template language="C#" debug="false" hostspecific="true"#>
<#@ assembly name="System.Windows.Forms" #>
<#@ import namespace="System.Resources" #>
<#@ import namespace="System.Collections" #>
<#@ import namespace="System.IO" #>
<#@ output extension=".js"#>
<#
 var path = Path.GetDirectoryName(Host.TemplateFile) + "/../App_GlobalResources/";
 var resourceNames = new string[1]
 {
  "Common"
 };

#>
/**
* Resources
* ---------
* This file is auto-generated by a tool
* 2012 Jochen van Wylick
**/
var Resources = {
 <# foreach (var name in resourceNames) { #>
 <#=name #>: {},
 <# } #>
};
<# foreach (var name in resourceNames) {
 var nlFile = Host.ResolvePath(path + name + ".nl.resx" );
 var enFile = Host.ResolvePath(path + name + ".resx" );
 ResXResourceSet nlResxSet = new ResXResourceSet(nlFile);
 ResXResourceSet enResxSet = new ResXResourceSet(enFile);
#>

<# foreach (DictionaryEntry item in nlResxSet) { #>
Resources.<#=name#>.<#=item.Key.ToString()#> = {
 'nl-NL': '<#= ("" + item.Value).Replace("\r\n", string.Empty).Replace("'","\\'")#>',
 'en-GB': '<#= ("" + enResxSet.GetString(item.Key.ToString())).Replace("\r\n", string.Empty).Replace("'","\\'")#>'
 };
<# } #>
<# } #>

Dans la Forme/Vue de côté

Pour avoir la traduction correcte ramassé, ajouter ceci dans votre maître si vous êtes à l'aide de Formulaires web:

<script type="text/javascript">

    var locale = '<%= System.Threading.Thread.CurrentThread.CurrentCulture.Name %>';

</script>

<script type="text/javascript" src="/Scripts/Resources.js"></script>

Si vous êtes en utilisant ASP.NET MVC (comme moi), vous pouvez faire ceci:

<script type="text/javascript">

    // Setting Locale that will be used by JavaScript translations
    var locale = $("meta[name='accept-language']").attr("content");

</script>

<script type="text/javascript" src="/Scripts/Resources.js"></script>

L' MetaAcceptLanguage helper j'ai reçu de ce super post de Scott, Hanselman:

La mondialisation, l'Internationalisation et de la Localisation dans ASP.NET MVC 3, JavaScript et jQuery - Partie 1

public static IHtmlString MetaAcceptLanguage<T>(this HtmlHelper<T> html)
{
     var acceptLanguage =
         HttpUtility.HtmlAttributeEncode(
                     Thread.CurrentThread.CurrentUICulture.ToString());

      return new HtmlString(
      String.Format("<meta name=\"{0}\" content=\"{1}\">", "accept-language",
                    acceptLanguage));
 }

L'utiliser

var msg = Resources.Common.Greeting[locale];
alert(msg);

4voto

Diodeus Points 67946

J'utiliserais une notation objet / tableau:

 var phrases={};
phrases['fatalError'] ='On no!';
 

Ensuite, vous pouvez simplement échanger le fichier JS ou utiliser un appel Ajax pour redéfinir votre liste de phrases.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X