跳轉至主要內容
線上翻譯

微軟翻譯博客

使用 microsoft 翻譯人員提供的翻譯創建 web 應用程式。

使用 microsoft 翻譯人員提供的翻譯創建 web 應用程式。

在此演練中, 您將學習如何創建使用 microsoft 翻譯器 api 翻譯使用者輸入的文本的 web 應用程式。您將使用 asp. net 和免費的 visual studio express 2012 構建該頁面。如果您已經有了 visual studio 安裝, 您仍然可以按照本教程操作, 只需跳過步驟1即可。

在開始之前, 您需要註冊 azure 中的 microsoft 翻譯 api。有許多不同的產品, 包括免費產品, 你可以看到如何註冊免費服務、註冊你的應用並在這裡獲得你的憑據:

http://blogs.msdn.com/b/translation/p/gettingstarted1.aspx

您在這裡生成的用戶端 id 和用戶端機密將在步驟4中使用, 因此請記下它們。

步驟1。獲取 visual studio express 2012 為 web。

最好的開始方法是參觀 http://www.asp.net/downloads , 然後在 "只需簡單安裝即可完成所有內容" 部分中選擇 "立即安裝" 按鈕。

clip_image001

這將啟動 web 平臺安裝程式, 該安裝程式將安裝 visual studio、asp. net、mvc 和大量其他可用於構建網站的好東西。

步驟2。創建 web 應用程式

運行 visual studio, 然後從 "檔" 功能表中選擇 "新建專案"。您將看到一個對話方塊, 其中包含可用於生成網站的不同專案的清單。選擇左側的 "visual c#", 然後從清單中選擇 "asp. net web 表單應用程式"。

clip_image003

為 web 應用程式命名, 如 "翻譯", 然後按 "確定"。visual studio 現在將創建生成和運行 web 應用程式所需的一切。按 f5 生成並運行應用程式, 您將看到如下內容:

clip_image005

 

 

步驟3。創建用於文本翻譯的 ui

在本節中, 您將向網站添加允許最終使用者鍵入某些文本的控制項, 按翻譯按鈕, 然後查看他們輸入的文本的翻譯。例如, 這種類型的功能對於在使用不同語言時與客戶交互非常有用。

從解決方案資源管理器中, 找到 "已提交. aspx" 頁面。在設計器中打開它, 您將看到如下內容:

clip_image016

Delete the 3 <p> tags that say ‘Use this area to provide additional information’, and replace with some controls to provide a basic translation UI, like this:

clip_image018

為方便起見, 以下是此頁的來源:

<%@ Page Title="About" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="About.aspx.cs" Inherits="Translator.About" %>

<asp: 內容 魯納= "伺服器" ID= "身體內容" 內容= "主要內容">
    <企業集團 = "標題">
        <h1><%: 標題 %>.</h1>
        <h2>你的應用說明頁面。</h2>
    </企業集團>

    <文章>
        輸入要翻譯的文本:<Br />
        <asp: 文字方塊 ID= "textbox1" 魯納= "伺服器" 高度= "25px" 寬度= "342px"></asp: 文字方塊>
        <asp: 按鈕 ID= "按鈕 1" 魯納= "伺服器" 高度= "37px" onclick= "Button1_Click" 文本= "翻譯" />
        <Br />
        您翻譯的文本是:<Br />
        <asp: 文字 ID= "文字 1" 魯納= "伺服器"></asp: 文字>
    </文章>

    <一邊>
        <h3>其他職務</h3>
        <P>        
            使用此區域可提供其他資訊。
        </P>
        <Ul>
            <><一個 魯納= "伺服器" Href="~/">回家</一個></>
            <><一個 魯納= "伺服器" Href= "~/about-abouts. aspx">關於金龍</一個></>
            <><一個 魯納= "伺服器" Href= "~/contactt. aspx">連絡人</一個></>
        </Ul>
    </一邊>
</asp: 內容>

請注意, 在設計器中, 應按兩下該按鈕以生成 "Button1_Click" 代碼。您將在下一步中編寫此代碼。

步驟4。編寫用於翻譯使用者文本的代碼

在上一節中, 您創建了用於文本翻譯的基本 ui。它將允許使用者編寫一些文本, 並按下一個按鈕。在本節中, 您將在該按鈕後面編寫代碼, 將使用者所需的文本翻譯成西班牙文, 並將其呈現在頁面上。

首先, 您需要向解決方案中添加一個新類。叫它吧 admaccess標記 並給它下面的代碼:

使用 制度; 制度; 制度; 制度;
使用 System.Collections.Generic;
使用 林克;
使用 網站;

命名 空間 在線翻譯
{
    公共  阿德姆阿塞斯托肯
    {
        公共 字串 access_token { get; set; }
        公共 字串 token_type { get; set; }
        公共 字串 expires_in { get; set; }
        公共 字串 scope { get; set; }
    }
}

 

請注意, 4 字串的名稱應與此處的名稱完全符合, 否則以後代碼中將出現錯誤。

接下來, 在 visual studio 的 "解決方案資源管理器" 中, 按右鍵 "引用" 資料夾, 然後選擇 "增加參考"。使用下面的此對話方塊將引用添加到

– System.Runtime.Serialization

– System.XML.Linq

– System.ServiceModel.Web

在 About.aspx.cs 的代碼頂部, 您將看到許多 "正在使用" 的語句。將使用 System.Xml.Linq 添加到這些, 使其如下所示:

使用 制度; 制度; 制度; 制度;
使用 System.Collections.Generic;
使用 林克;
使用 網站;
使用 System.Web.UI;
使用 System.Web.UI.WebControls;
使用 System.Xml.Linq;

命名 空間 在線翻譯
{
    公共 部分  About : Page
    {
        保護 無效 頁面 _ 載入 (物件 寄件者,事件障礙e)
        {

}

        保護 無效 Button1_Click (物件 寄件者,事件障礙e)
        {

}
    }
}

 

您將看到 Button1_Click 代碼為空。向其中添加以下代碼。此代碼將使用之前創建的用戶端 id 和用戶端機密獲取翻譯服務的訪問權杖。

字串 用戶端 id = "<Your ClientID>";
字串 用戶端機密 = "<Your Client Secret>";
字串字串轉換 accessuri = 
      "HTTPs://datamarket.accesscontrol.windows.net/v2/OAuth2-13";
字串字串請求詳細資訊 = 
      字串.格式 ("grant_type=client_credentials&client_id={0}&client_secret={1} &scope=http://api.microsofttranslator.com", url編碼 (客戶 id), HTTP. urlcode (客戶機密);

System.Net.WebRequest 的 web 請求 = System.Net.WebRequest.Create (字串轉換訪問);
網站請求. 內容類型 = "應用程式/www-forms-urlenen編碼";
方法 = "開機自檢";
位元組[] 位元組 = System.Text.Encoding.ASCII.GetBytes (請方詳細資訊);
網站請求. 內容長度 = 位元組。長度;
使用 (System.IO.Stream outputStream = webRequest.GetRequestStream())
{
  outputStream.Write(bytes, 0, bytes.Length);
}

System.Net.WebResponse webResponse = webRequest.GetResponse();
System.Runtime.Serialization.Json.DataContractJsonSerializer serializer = 新增功能 
    System.Runtime.Serialization.Json.DataContractJsonSerializer (類型(admaccess標記));

權杖 = (admaccess權杖) 序列化程式。閱讀物件 (網路回應. getresestream ());

字串 頭像值 = "承載者" + 標記. access _ 標識;

 

此代碼將對資料超市服務形成 post, 傳遞您的 id 和機密, 並獲取 json 物件。然後將該物件反序列化為 admaccesstoken。然後, 您可以從中派生訪問權杖。

然後將此標記添加到字串中, 首碼為 "承載者" (不要忘記空格), 以創建將發送到翻譯服務的標頭值。

然後使用此標題值調用翻譯服務, 並傳遞使用者的文本, 您將使用如下代碼:

字串 ttto-tetp0純 = textbox1. text;
字串 uri = "HTTP://api.microsofttranslator.com/v2/Http.svc/Translate?text =" + System.Web.HttpUtility.UrlEncode (txtToTranslate) + "從 = en & to = es";
System.Net.WebRequest 翻譯 webrequest = System.Net.WebRequest.Create (uri);
translationWebRequest.Headers.Add ("授權", 頭像價值);

System.Net.WebResponse 回應 = ;
回應 = 翻譯 webreqution. get回應 ();
System.IO.Stream 流 = 回應。();
System.Text.Encoding 編碼 = System.Text.Encoding.GetEncoding ("utf-8");

System.IO.StreamReader 翻譯流 = 新增功能 System.IO.StreamReader (流、編碼);
System.Xml.XmlDocument xTranslation = 新增功能 System.Xml.XmlDocument ();
(翻譯流. readtoend ());

文本 1. 文本 = x 翻譯。

 

 

文字方塊被稱為 "textbox1", 因此使用者鍵入的文字可以簡單地從中派生。之後, 將創建轉換器 HTTP 服務的 uri, 文本本身是 url 編碼並添加到 uri。

請注意, "en" 語言用於 "寄件者" (即, 我假設您是用英語鍵入), 而 "es" 用於 "to" (即它將翻譯成西班牙文)。支援的語言的這些代碼的完整清單如下所示: HTTP://msdn.microsoft.com/en-us/library/hh456380.aspx

轉換器服務返回 xml, 因此代碼調用該服務, 將回應作為 xml 獲取, 然後將其解碼為文本。然後, 它將結果載入到您在 au. aspx 上創建的名為 "文本 1" 的文本中。

你可以在這裡看到它的作用:

clip_image019

這就對了!現在, 您已使用 microsoft 翻譯 api 將機器翻譯添加到 asp. net 應用程式。

總結

在本演練中, 您瞭解了如何使用 asp. net 生成 web 應用程式, 以及如何向其中添加機器翻譯。您使用 microsoft 翻譯小工具提供頁面內容的翻譯, 並且瞭解了如何使用 c# 對 microsoft 翻譯器 api 進行程式設計, 以便翻譯使用者生成的內容。