65.9K
CodeProject 正在变化。 阅读更多。
Home

Google Translator API v2 实现

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.78/5 (7投票s)

2011 年 12 月 25 日

CPOL

3分钟阅读

viewsIcon

75829

downloadIcon

4771

这是一个非常简单的 Google 翻译 API v2 实现。它是一个简单的 HTML 文件,并使用 jQuery 进行客户端操作。

引言

这些天,Google 正忙于关闭他们提供的免费好东西/服务。 语言翻译服务是其中之一,已于 2011 年 12 月 1 日完全关闭。 现在 Google 推出了翻译 API V2,这是翻译服务的付费版本。 许多依赖免费版本服务的应用程序受到了影响,一些已经选择了付费版本,还有一些正在迁移提供商。 微软也有一个免费的东西 必应翻译 API。 无论如何,我不会在这里讨论必应,而是专注于 Google 语言翻译 API v2。

背景

这是一个非常简单易懂的 API 实现,它建立在简单的 HTML 页面上,并使用 jQuery 完成大部分客户端相关的活动。

注意:在继续之前,我想强调一下,本文假设您拥有有效的 Google API v2。 这个 视频 提供了获取 Google API 密钥所需的所有指导。

Using the Code

为了简单起见,我将文章内容分成了 3 部分

支持的语言 – 这一部分将重点介绍 Google 翻译支持的语言列表。

API 提供了支持语言的代码列表,但默认情况下不提供语言名称。 如果需要语言名称,我们可以传递其他参数 Target 并指定我们希望提供语言名称的语言代码。 例如,如果我们指定代码为“zh-CN”,它将以“简体中文”提供语言名称,如果代码为“en”,它将以“英文”列出名称。

Code functionality for loading all the supported Languages by Google API 
function loadLanguages() {
   var apiurl = "https://www.googleapis.com/language/translate/v2/languages?key=" + 
    apiKey<span class="Apple-tab-span" style="white-space: pre; ">        
    </span> + "&target=en";

            $.ajax({
                url: apiurl,
                dataType: 'jsonp',
                success: function (data) {
                    var languages = data.data.languages;
                    $.each(languages, function (index, language) {
                        $('#selSourceLanguage').append('<option value="' + 
            language.language + '">' + language.name + '</option>');
                        $('#selTargetLanguage').append('<option value="' + 
            language.language + '">' + language.name + '</option>');
                    });
                    $("select#selSourceLanguage").val('en');
                    $("select#selTargetLanguage").val('en');
                },
                error: function (x, e) {
                    alert('Error occurred while loading the Google Supported Languages');
                }
            });
 }

检测语言 – 这一部分将重点介绍检测最终用户提供的用于翻译的文本的语言。 API 将利用其内部 AI 来识别语言并通知最终用户。 如果不可能,它将通知为“未知”。

Code functionality for auto detecting the language of the text to be translated 
function detectLanguage() {
   var text = $.trim($('#txtOrgText').val());
   if (text.length > 0) {
     var apiurl = "https://www.googleapis.com/language/translate/v2/detect?key=" + 
    apiKey <span class="Apple-tab-span" style="white-space: pre; ">    
    </span>+ "&q=";

       $.ajax({
          url: apiurl + encodeURIComponent(text),
          dataType: 'jsonp',
          async: false,
          success: function (data) {
                 var obj = data.data.detections[0];
                 $('#selSourceLanguage').val(obj[0].language);
                 langSource = obj[0].language;
                 $('#divDetectedLanguage').html("The automatically detected language is: 
        " <span class="Apple-tab-span" style="white-space: pre; ">            
        </span>+ $('#selSourceLanguage option:selected').text());
                 $.unblockUI();
          <span class="Apple-tab-span" style="white-space: pre; ">    </span>},
          error: function (x, e) {
                 $('#divDetectedLanguage').html
        ("Error occurred while detecting the current 
        <span class="Apple-tab-span" style="white-space: pre; ">            
        </span>text language");
                 $.unblockUI();
                }
              });
      }
      else {
         $('#divDetectedLanguage').html("No Text for Translation was provided");
         $.unblockUI();
      }
 }

翻译 – 这将是我们的最后通牒。 将文本翻译成所需的语言(由 Google API 支持)。

Code functionality to translate the text 
 $('#btnTranslate').click(function (e) {
     e.preventDefault();

     var text = $.trim($('#txtOrgText').val());
     $('#divTranslated').html("");
     if (text.length > 0) {
         var langSource = $('#selSourceLanguage').val();
         var langTarget = $('#selTargetLanguage').val();

         if (langSource === "" || langTarget === "") {
             alert("Select Source Language and Target Language");
         }
         else if (langSource === langTarget) {
             alert("Source Language and Target Language cannot be same");
         }
         else {
              $.blockUI({ css: {
              border: 'none',
              padding: '15px',
              backgroundColor: '#000',
              '-webkit-border-radius': '10px',
              '-moz-border-radius': '10px',
              opacity: .5,
              color: '#fff'
             }
         });
     var apiurl = "https://www.googleapis.com/language/translate/v2?key=" + apiKey + 
    "                       &source=" + langSource + "&target=" + langTarget + "&q=";

     $.ajax({
        url: apiurl + encodeURIComponent(text),
        dataType: 'jsonp',
        async: false,
        success: function (data) {
        <span class="Apple-tab-span" style="white-space: pre; ">    
        </span> if (langSource === langTarget) {
                     $('#divTranslated').html(text);
                 }
                 else if (langSource != "") {
                  try {
                       $('#divTranslated').html(data.data.translations[0].translatedText);
                  }
                  catch (e) {
                       $('#divTranslated').html(text);
                  }
             }
             $('#divTranslated').css({ "border": "1px solid #7F9DB9" });
             $('#divTranslated').css({ "padding": "4 4 4 4" });

             $('#lblTranslation').css({ "color": "black" });
             $.unblockUI();
            },
           error: function (x, e) {
              alert('Error occurred while translating the text');
              $.unblockUI();
           }
         });
        }
      }
      else {
          alert("Nothing was entered to translate");
          $.unblockUI();
        }
     });
    $.unblockUI();
});

本文实现中遵循的流程非常简单。 实现的 UI 具有自解释性。 我们有一个文本框,最终用户可以在其中输入他/她希望翻译的文本。 有两个下拉菜单,它们预先加载了 Google API 支持翻译的语言列表,以及两个按钮,它们执行指示的动作“检测”和“翻译”。

提供文本后,用户可以使用“检测”按钮并使用 Google API 服务,该服务尝试检测语言的语言并将检测到的语言设置为源语言。 如果 Google 服务无法检测到该语言,它将源语言设置为未知。 并且在任何时候,用户都可以手动选择源语言和目标语言,并使用“翻译”选项来完成翻译。

关注点

这是一个非常基本的实现,可以改进。

历史

您可以在此处找到使用早期版本 Google API 的 Google 翻译器的实现

© . All rights reserved.