Pessoal,

Para quem quiser utilizar a API do Google Translate para traduzir partes de um documento HTML, segue uma implementação que tive que fazer recentemente utilizando jQuery e ASP.NET MVC:

  • Controller Action para fazer o request para a API REST:
[ValidateInput(false)]
public ActionResult Translate(FormCollection vars) {
string reqUri = "https://www.googleapis.com/language/translate/v2?key=YOUR_GOOGLE_API_KEY&source=pt&target=en&format=html";`


var webRequest = (HttpWebRequest)WebRequest.Create(reqUri);`


webRequest.ContentType = "application/x-www-form-urlencoded";
webRequest.Method = "POST";`

byte[] bytes = Encoding.UTF8.GetBytes("q=" + vars["q"]);
webRequest.ContentLength = bytes.Length;
webRequest.Headers.Add("X-HTTP-Method-Override", "GET");`

using (Stream outputStream = webRequest.GetRequestStream()) {
outputStream.Write(bytes, 0, bytes.Length);
}

using (WebResponse webResponse = webRequest.GetResponse()) {
if (webResponse == null) {
return null;
}
using (StreamReader sr = new StreamReader(webResponse.GetResponseStream())) {
return Content(sr.ReadToEnd().Trim(), "text/json");
}
}
}

Algumas considerações sobre esta action:

  • Não estamos validando o parâmetro q de entrada. Seria interessante validar a presença deste parâmetro no form e lançar uma exceção caso ele não esteja presente;

  • Não esqueça de passar para o parâmetro key a sua chave da API do google;

  • Uma melhoria seria receber via form também o código do idioma fonte e destino (parâmetros source e target da URL).

Vamos agora para o código de cliente (JavaScript) para atualizar a view:

var translateUrl = '<%= Url.Action("Translate") %>';

$(function () {
  translateElement("caseText");
  translateElement("caseTitle");
});

function translateElement(elemId) {
  $.ajax({
    url: translateUrl,
    dataType: "json",
    type: "POST",
    data: {
      q: $("#" + elemId).html(),
    },
    success: function (json) {
      // TODO: I've found that the returned translated text from Google may be incomplete
      // if we send any   elements within the text. We should remove any occurrences
      // of this in the input string.
      $("#" + elemId).html(unescape(json.data.translations[0].translatedText));
    },
  });
}

O que este código faz é apenas chamar a Action Translate que, por sua vez, chama a API do Google e retorna o JSON com o texto traduzido. Feito isso, a função translateElement apenas atualiza o conteúdo do elemento com a tradução.

Acredito que o código seja auto explicativo. Qualquer dúvida, por favor perguntem nos comentários :)

Documentação da api aqui e aqui.

Abraços!