.NET

28 mai, 2014

Internacionalização de sites ASP.NET

Publicidade

Seu site pode ser acessado em muitos países e culturas? Há várias técnicas diferentes, como sub domínios, textos gravados no banco etc., mas se no caso você tem uma aplicação, ou um simples site, você pode querer que alguns itens de tela mudem de acordo com a cultura/língua de quem estiver acessando, correto?

Primeiro, citando o Scott Hanselman, o que é Globalização, Internacionalização, Língua e Local:

  • Internationalization (i18n) – Faz a sua aplicação suportar diferentes linguagens e locais.
  • Localization (L10n) – Faz a sua aplicação suportar uma especifica língua ou local.
  • Globalization – A combinação de Internationalization e Localization.
  • Language – Por exemplo o português, geralmente possui código ISSO – no caso de português, o “pt”.
  • Locale – Por exemplo o Brasil – no caso temos os porquês do Brasil, “pt_br” e o português de Portugal, como o “pt_pt”.

No .NET Framework, temos duas propriedades relacionadas a Culture, que coordena o resultado de funções que depende de cultura, como data, formatação de moeda etc., e a UICulture, responsável pelo valor de recursos que serão mostrados na tela.

Se você quiser tornar seu site amigável a determinada cultura, você pode forçar isso no webconfig com a tag Globalization.

Nesse exemplo, forcei a cultura para português, especificamente português do Brasil. Assim, a formatação de hora, por exemplo, permanecerá no estilo português do Brasil (dia/mês/hora). Essas siglas que você vê, como fr, en, pt, pt-BR e outras fazem parte do padrão BCP 47, em que é definida a formula: language-extlang-script-region-variant-extension-privateuse Exemplos: pt, pt-BR, pt-EU, en, en-US, en-EU, fr, fr-FR, fr-CA etc.

Culture, UICulture e Accept-Language

Também podemos trocar Culture e UICulture programaticamente, como no exemplo a seguir:

Thread.CurrentThread.CurrentCulture =
CultureInfo.CreateSpecificCulture("pt");
Thread.CurrentThread.CurrentUICulture = new
CultureInfo(“pt-BR”);

Podemos então fazer uma página que mude de cultura automaticamente. Veremos isso em um próximo artigo. Bom, temos agora como forçar determinada cultura, mas como fazer que nosso site se adapte à língua dele? Primeiramente, como sabemos qual a língua do usuário? Os navegadores possuem uma configuração para isso, eles podem indicar qual a língua por meio de um parâmetro passado entre as requisições HTTP, o Accept-Language. Segundo a W3C, esse parâmetro não é o mesmo que a definição de interface do navegador, mas se refere à linguagem que é esperada. Esse parâmetro é passado pela requisição e o servidor consegue entender qual a linguagem que o usuário espera, sempre no padrão BCP 47. Um exemplo desse parâmetro numa requisição HTTP: Accept-Language: da, en-gb;q=0.8, en;q=0.7. Okay, para pegar o valor de Accerpt Language do usuário, precisamos somente pegar essa propriedade dentro dos Headers da Requisição, como no exemplo a seguir:

string languages = "";
if (Request.Headers["Accept-Language"] != null)
    {
        languages = Request.Headers["Accept-Language"].ToString();
    }

Sei agora a linguagem do usuário e como colocar seu valor nas propriedades de cultura, sei também como deixar automático para configurações de data e outras características, mas isso não faz o texto mudar de acordo com a linguagem.

Web Resources

Uma vez colocada no seu webconfig a tag de globalização para detecção automática, você pode acrescentar recursos de idioma na sua página. Relembrando: a tag de globalização é a seguir colocada dentro da tag de system.web. Os Web Resources, também lembrados como Global resources, são recursos adicionados à sua web application, cada um com um valor diferente para suas chaves e que, ao solicitarem determinado conteúdo de determinada língua, eles entregam o conteúdo que foi cadastrado para ele. Os Web Resources são arquivos XML, e sua estrutura é: propriedade, tipo de valor e valor. Pode-se acrescentar propriedades do tipo texto, imagem, ícone, áudio, arquivo e outros. Dessa forma, você pode customizar totalmente seu site dependendo da língua. Por exemplo, como eu disse no início do artigo, Globalização engloba a localidade, e é possível que em dois locais diferentes imagens tenham significados diferentes, às vezes até ofensivos. Esse é o motivo, por exemplo, de o Facebook ter imagens diferentes para o botão de Like em alguns países.

Implementação de Web Resources no ASP.NET Web Forms

A implementação tanto para ASP.NET Web Forms quanto para ASP.NET MVC é semelhante. A primeira coisa é criar uma pasta para os resources.

Adicionando Resources

Clique com o botão direito no nome da sua web aplication na Solution Explorer, vá para Add, depois Add para ASP.NET Folder e por fim escolha App_GlobalResources. O processo é o mesmo para ASP.NET Web Forsm e para ASP.NET MVC.

adicionando-resources
Essa figura mostra como adicionar a pasta de Global Resources no Visual Studio 2013.

Depois você pode adicionar arquivos de Resource na sua pasta. Clicando com o botão, selecionando a pasta App_GlobalResources e escolhendo a opção Add para adicionar um arquivo de recursos, usaremos um para cada língua escolhida, tendo cada uma um sufixo com o código da língua. Por exemplo: teremos uma página com informações sobre o ASP.NET em português, inglês, francês, espanhol e italiano, então teremos cinco arquivos: aspnet.pt.resx, aspnet.resx (em inglês, será o default), aspnet.fr.resx, aspnet.es.resx e aspnet.it.resx :D. Agora preenchemos as informações sobre o conteúto das páginas. É recomendado que sejam informações curtas, não textos enormes. Veremos em outro artigo sobre informações enormes, postagens, e mais. Cada linha do nosso arquivo de resource tem três campos: nome, valor e comentário. Em cada um dos arquivos, vamos deixar os mesmos nomes. Veja a seguir a imagem de como será o arquivo português:

Figura mostra os itens do arquivo aspnet.pt.resx em português
Figura mostra os itens do arquivo aspnet.pt.resx em português.

Agora é só traduzir os conteúdos.

Usando as strings do Resources

Terminado de traduzir os recursos, você precisa chamá-los no seu site. Independentemente da forma, você precisa chamar; no caso dos nossos textos, chamar as strings do nosso resource. Bem, vamos adicionar uma label para o título da página, que ficará com o texto do “mainTitle” – veja a seguir o código dela. Observe que colocamos no texto da label uma diretiva chamando resources. O nome que vem logo depois dos dois pontos é o nome do arquivo de resources. Se você quisesse, poderia organizar suas traduções em nomes diferentes – por exemplo, temos os arquivos aspnet, poderíamos ter um arquivo about.resx, e suas variantes para cada língua. Vejamos agora o exemplo, como ficou o titulo com o navegador configurado para inglês, depois português, italiano e francês:

exemplo-de-internacionalização-em-inglês
Exemplo de internacionalização em inglês.
Exemplo de internacionalização em português.
exemplo de internacionalização em itaiano
Exemplo de internacionalização em italiano.
exemplo de internacionalização em francês
Exemplo de internacionalização em francês.

Pronto, agora é só ir chamando as strings de resources nas demais labels do site.

Nota: você pode ver que há abaixo do título no meu print screen uma label com a língua usada no exemplo. Eu só usei uma label que está no exemplo.

Implementação de Web Resources no ASP.NET MVC

Vamos agora ver como fazer o mesmo efeito em um site feito com ASP.NET MVC. Primeiramente, clique com o botão direito no nome do projeto; eu selecionei para adicionar uma pasta de resources da mesma forma que fiz no exemplo anterior com web forms. Outra oportunidade para você ver como os recursos entre as duas formas de se trabalhar com ASP.NET são parecidos. Acrescente os arquivos de resources como no exemplo anterior. A diferença está na forma como vamos chamar as strings dos web resources.

Quando usamos Razor, é bem mais fácil chamar uma string do resource: somente usar arroba (@) seguido de Resources + ponto (.) + o nome da string.

Eu até colocaria os print screen, mas seriam iguais aos anteriores =D

Além da língua, localidade

Se você quisesse separar ainda mais, poderia trocar seus arquivos para não ter somente diferenças por línguas, mas por localidades também. Um exemplo seria um arquivo para inglês dos Estados Unidos e um para inglês da Inglaterra; sendo assim, seus nomes seriam: aspnet.en-US.resx para Estados Unidos e asp.net.en-UK.resx para inglês da Inglaterra.