Fermer

mai 17, 2022

Comment utiliser la localisation dans ASP.NET Core

Comment utiliser la localisation dans ASP.NET Core


Aujourd’hui, nous allons voir comment utiliser la localisation et la globalisation dans les applications ASP.NET Core.

Dans ce didacticiel pas à pas, nous allons en savoir plus sur la localisation dans une application ASP.NET Core. Ce didacticiel couvre les sujets suivants :

Qu’est-ce que la mondialisation et la localisation ?

En informatique, la mondialisation (ou l’internationalisation) et la localisation sont des moyens d’adapter un logiciel à diverses langues, spécificités régionales et exigences techniques d’un lieu cible, selon Wikipédia.

La mondialisation rend les logiciels adaptables à différentes langues et régions, de sorte qu’ils sont disponibles dans le monde entier.

La localisation consiste à adapter un logiciel à une région ou à une langue particulière. Cela implique non seulement la langue, mais également des éléments culturels spécifiques à une région, tels que le format de date et d’heure préféré, le formatage des devises et des nombres et les unités de mesure.

Dans ASP.NET Core, à l’aide de services et de middleware, nous pouvons localiser l’application pour prendre en charge plusieurs langues et cultures.

Créer un projet .NET Core

Tout d’abord, créons un nouveau projet ASP.NET Core MVC à l’aide de Visual Studio. Suivez les étapes ci-dessous pour créer le projet :

Étape 1: Ouvrez Visual Studio (j’utiliserai Visual Studio 2022).

studio visuel 2022

Étape 2: Cliquer sur Créer un nouveau projet.

VS-créer-un-nouveau-projet

Étape 3: Sélectionner Application Web ASP.NET Core dans la liste des modèles de projet et cliquez sur le Suivant bouton.

Dans VS, parmi les modèles, nous choisissons ASP.NET Core Web APP Model-View-Controller

Étape 4: Indiquez le nom du projet et l’emplacement où enregistrer le projet créé. Ici, nous avons donné le nom du projet comme DotNetCoreLocalizationDotNetCoreLocalizationDotNetCoreLocalization. Clique le Suivant bouton.

VS-configurer-nouveau-projet

Étape 5 : Sur cette page, vous verrez le cadre par défaut, le type d’authentification et d’autres configurations, etc., cliquez sur Créer bouton.

VS-informations-supplémentaires

Étape 6 : Enfin, le projet est créé, avec une structure de projet comme la capture d’écran ci-dessous.

vs-project-structure contient des services connectés, des dépendances, des propriétés, wwwroot, des contrôleurs, des modèles, des vues, appsettings.json, program.cs, startup.cs

Étape 7 : Succès F5 ou exécutez le projet, et vous verrez la sortie comme ci-dessous capture d’écran.

Le projet de localisation .NET Core vous souhaite la bienvenue dans Telerik, découvrez les applications Web avec ASP.NET Core

Comment configurer le projet pour la localisation

Configurons le projet. Pour cela, nous devons utiliser le ConfigureServices méthode de la Commencez classe. Il existe trois méthodes pour configurer la localisation dans ASP.NET Core :

  • Ajouter Localisation : Cette méthode ajoute les services de localisation dans le conteneur de services, et nous pouvons également définir le Ressources chemin d’accès au fichier dedans.
  • AddViewLocalization : En utilisant cette méthode, nous pouvons utiliser la localisation dans les fichiers de vue à l’aide de IViewLocalizer.
  • AddDataAnnotationsLocalization : En utilisant cette méthode, nous pouvons utiliser la localisation dans le Annotations de données messages de validation à l’aide de IStringLocalizer.

Fichiers de ressources de localisation

Comprenons d’abord l’utilisation du fichier de ressources. Le fichier de ressources est utilisé pour séparer les chaînes de localisation du code. Ces chaînes de localisation sont stockées dans le valeur clé formater avec .resx extension de fichier.

Conventions de nom de fichier de ressources

Il existe deux manières de fournir les noms des fichiers de ressources :

  • Utiliser un point
    Exemple: Resources/Controllers.TestController.en-US.resx
  • Utilisation du chemin
    Exemple: Ressources/Controllers/TestController.en-US.resx

Syntaxe: nom-fichier.région-langue.resx

Ensuite, nous allons ajouter les fichiers de ressources pour la localisation dans notre projet en suivant les étapes ci-dessous :

Étape 1: Ouvrir Explorateur de solution onglet et clic droit sur le projet Ajouter -> Nouveau dossier et nommez-le comme Ressources. Nous conservons tous les fichiers de ressources liés au projet dans ce dossier uniquement.

Étape 2: Ensuite, faites un clic droit sur le dossier créé Ajouter -> Nouvel élément.

Ajouter un nouvel élément

Étape 3: Dans le Ajouter un nouvel élément pop-up, recherche Ressource modèle et nommez-le Controllers.HomeController.en-US.resx. Ici, nous l’avons ajouté pour le contrôleur, ajoutez-en un autre pour le nom de la vue comme
Views.Home.Index.en-US.resx.

recherche de ressources nommée Controllers.HomeController.en-US.resx

Étape 4: Une fois le fichier de ressources ajouté, vous verrez la sortie comme ci-dessous. Il contient trois colonnes : Nom, valeur, commentaire. Ces valeurs dont nous avons besoin pour le remplir.

nom-valeur-commentaire

Étape 5 : Dans le fichier de ressources créé, j’ai ajouté une valeur de chaîne de localisation par défaut : Nom – télérik et Valeur – Telerik.

nom de chaîne - valeur telerik - telerik

Configurez la localisation :

Dans le code ci-dessous, vous pouvez voir la méthode que nous avons utilisée et nous avons défini le nom du dossier sur CheminRessource comme nous l’avons créé précédemment Ressources. Ici, nous l’avons configuré pour Vues et Annotations de données message de validation.

public void ConfigureServices(IServiceCollection services)
{
    services.AddLocalization(o => { o.ResourcesPath = "Resources"; });
    services.AddControllersWithViews()
        .AddViewLocalization(LanguageViewLocationExpanderFormat.Suffix)
        .AddDataAnnotationsLocalization();
}

Comment accéder à la chaîne de localisation à partir du fichier de ressources

Il existe trois façons d’accéder à la chaîne de localisation à partir des fichiers de ressources comme ci-dessous :

1. IStringLocalizer

Cette interface représente un service qui fournit des chaînes localisées. Si la clé respectée n’est pas trouvée, il renvoie alors la clé comme résultat. Ci-dessous les méthodes :

  • Méthode 1 : Obtenez les chaînes de localisation à partir du fichier de ressources.
LocalizedString this[string name]
  • Méthode 2 : Obtenez la chaîne de localisation avec le résultat formaté à partir du fichier de ressources.
LocalizedString this[string name, params object[] arguments]
  • Méthode 3 : Obtenez toutes les chaînes de localisation à partir du fichier de ressources.
IEnumerable<LocalizedString> GetAllStrings(bool includeParentCultures);
  • Méthode 4 : Obtenez les chaînes de localisation à partir du fichier de ressources.
LocalizedString GetString(string name);

Exemple

public IActionResult Index()
{
    ViewData["Title"] = _stringLocalizer["title"].Value;
    return View();
}

Dans le code ci-dessus, nous accédons à la chaîne de localisation à partir du fichier de ressources à l’aide de la IStringLocalizer et en attribuant cette valeur au AfficherDonnées propriété de titre et en utilisant cette valeur dans Index.cshtml page comme ci-dessous :

@ViewData["Title"];

Production

Clé de localisation que nous avons utilisée dans le fichier de ressources : Titre.
Localisez la valeur de cette clé dans le fichier de ressources : Localisation.

IStringLocalizer

2. IViewLocalizer

Cette interface représente un type qui fournit une localisation compatible HTML pour les vues. Ci-dessous les méthodes :

  • Méthode 1 : Obtenez les chaînes de localisation à partir du fichier de ressources.
LocalizedString this[string name]
  • Méthode 2 : Obtenez la chaîne de localisation avec le résultat formaté à partir du fichier de ressources.
LocalizedString this[string name, params object[] arguments]
  • Méthode 3 : Obtenez toutes les chaînes de localisation à partir du fichier de ressources.
IEnumerable<LocalizedString> GetAllStrings(bool includeParentCultures);
  • Méthode 4 : Obtenez les chaînes de localisation à partir du fichier de ressources.
LocalizedString GetString(string name);
  • Méthode 5 : Obtenez la chaîne de localisation avec le résultat formaté à partir du fichier de ressources.
LocalizedString GetString(string name, params object[] arguments);

Exemple

@using Microsoft.AspNetCore.Mvc.Localization
@inject IViewLocalizer Localizer

@{
    ViewData["Title"] = "Home Page";
}
<div class="text-center">
    <h1 class="display-4">Welcome to @Localizer["telerik"]</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

Dans le code ci-dessus, nous avons injecté le IViewLocalizer avec l’aide de @injecter et accéder à la chaîne de localisation à partir du fichier de ressources comme ci-dessous :

@Localizer["telerik"]

Production

Clé de localisation que nous avons utilisée dans le fichier de ressources : télérik.
Localisez la valeur de cette clé dans le fichier de ressources : Télérik.

IViewLocalizer

3. HtmlLocalizer

Cette interface représente un type qui effectue la localisation HTML des chaînes par des arguments de codage HTML qui sont formatés dans la chaîne de ressource. Ci-dessous les méthodes :

  • Méthode 1 : Obtenez les chaînes de localisation à partir du fichier de ressources.
LocalizedString this[string name]
  • Méthode 2 : Obtenez la chaîne de localisation avec le résultat formaté à partir du fichier de ressources.
LocalizedString this[string name, params object[] arguments]
  • Méthode 3 : Obtenez toutes les chaînes de localisation à partir du fichier de ressources.
IEnumerable<LocalizedString> GetAllStrings(bool includeParentCultures);
  • Méthode 4 : Obtenez les chaînes de localisation à partir du fichier de ressources.
LocalizedString GetString(string name);
  • Méthode 5 : Obtenez la chaîne de localisation avec le résultat formaté à partir du fichier de ressources.
LocalizedString GetString(string name, params object[] arguments);

Exemple

@using DotNetCoreLocalization.Controllers
@using Microsoft.AspNetCore.Mvc.Localization

@inject IViewLocalizer Localizer
@inject IHtmlLocalizer<HomeController> HtmlLocalizer
@{
    ViewData["Title"] = @ViewData["Title"];
}
<div class="text-center">
    <h1 class="display-4">Welcome to @Localizer["telerik"]</h1>
    <p>@HtmlLocalizer["LearnMore"].</p>
    <br />
</div>

Dans le code ci-dessus, nous avons injecté le IHtmlLocalizerIHtmlLocalizer avec l’aide de @injecter et accéder à la chaîne de localisation à partir du fichier de ressources comme ci-dessous :

@HtmlLocalizer["LearnMore"]

Production

Clé de localisation que nous avons utilisée dans le fichier de ressources : Apprendre encore plus.
Localisez la valeur de cette clé dans le fichier de ressources : En savoir plus création d’applications Web avec ASP.NET Core.

IHtmlLocalizerIHtmlLocalizer

Ensuite, jusqu’à présent, nous n’avons discuté que de la création du projet, de l’ajout du fichier de ressources, puis de sa configuration et de l’accès à partir du fichier de ressources par défaut. Anglais Langue. Ajoutons un autre fichier de ressources linguistiques pour Allemand comme nous l’avons fait à l’étape précédente, et vous devez convertir les premières valeurs du fichier de ressources en Allemand une fois que vous avez ajouté ce fichier de ressources.

Comment configurer la culture par défaut

Pour configurer la culture dans notre projet, nous devons activer le middleware de localisation dans le Configurer méthode de la Commencez classe. Dans cette configuration, nous pouvons fournir la culture prise en charge pour le projet et définir la culture par défaut.

Ajoutez la ligne ci-dessous dans le Configurer method — elle doit être ajoutée avant qu’un middleware n’accède à la culture de requête :

app.UseRequestLocalization();

Cette RequestLocalizationMiddleware fournit les trois fournisseurs de culture de demande intégrés. Ceux-ci sont accessibles à l’aide du RequestLocalizationOptions et vous pouvez également écrire votre propre fournisseur personnalisé. Voici les fournisseurs intégrés :

  1. CookieRequestCultureProvider
  2. QueryStringRequestCultureProvider
  3. AcceptLanguageHeaderRequestCultureProvider

Noter: Si vous souhaitez utiliser l’un des fournisseurs de culture de demande ci-dessus, vous devez supprimer la ligne ci-dessous et configurer les fournisseurs de culture de demande.

options.RequestCultureProviders.Clear();

Ajoutez le code ci-dessous au ConfigureServices méthode:

services.Configure<RequestLocalizationOptions>(options =>
{
    options.SetDefaultCulture("de-DE");
    options.AddSupportedUICultures("en-US", "de-DE");
    options.FallBackToParentUICultures = true;
    options.RequestCultureProviders.Clear();
});

Dans le code ci-dessus, nous avons pris en charge deux cultures fr-US et jusqu’àet définissez la culture par défaut sur jusqu’à. Une fois que vous avez ajouté le code ci-dessus, votre Commencez la classe devrait maintenant ressembler à ceci :

public class Startup
    {
        public Startup(IConfiguration configuration)
        {
            Configuration = configuration;
        }

        public IConfiguration Configuration { get; }

        
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddLocalization(o => { o.ResourcesPath = "Resources"; });
			
			
            services.Configure<RequestLocalizationOptions>(options =>
            {
                options.SetDefaultCulture("de-DE");
                options.AddSupportedUICultures("en-US", "de-DE");
                options.FallBackToParentUICultures = true;
                options.RequestCultureProviders.Clear();
            });

            services.AddControllersWithViews()
                .AddViewLocalization(LanguageViewLocationExpanderFormat.Suffix)
                .AddDataAnnotationsLocalization();
        }

        
        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }
            else
            {
                app.UseExceptionHandler("/Home/Error");
            }
            app.UseStaticFiles();

            app.UseRouting();

            app.UseAuthorization();

			
            app.UseRequestLocalization();

            app.UseEndpoints(endpoints =>
            {
                endpoints.MapControllerRoute(
                    name: "default",
                    pattern: "{controller=Home}/{action=Index}/{id?}");
            });
        }
    }

Ensuite, exécutez l’application. Vous verrez la sortie comme la capture d’écran ci-dessous basée sur l’ensemble de culture par défaut :

Pour les paramètres régionaux en-US

Sortie US

Pour de-DE local

Sortie DE

Dans les deux sorties ci-dessus, les textes en surbrillance sont des chaînes localisées provenant du fichier de ressources.

Noter: Cette application de démonstration ne fonctionne que pour les langues anglaise et allemande. Si vous voulez plus de langues, vous devez ajouter ces fichiers de ressources linguistiques.

Vous pouvez télécharger cet exemple sur ici.

Conclusion

Dans cet article, nous avons appris à configurer la localisation dans l’application ASP.NET Core, à accéder à la chaîne de localisation à partir des fichiers de ressources et à définir la langue et la culture par défaut de l’application. Si vous avez des suggestions ou des questions concernant cet article, s’il vous plaît contactez-moi.

« Apprend le. Partagez-le. »




Source link