Tworzenie aplikacji sieci Web z tłumaczeniem udostępniane przez Microsoft Translator.

Opublikowano w dniu 19 grudnia, 2012przez Microsoft Translator

Tworzenie aplikacji sieci Web z tłumaczeniem udostępniane przez Microsoft Translator.

W tym instruktażu dowiesz się, jak utworzyć aplikację sieci Web, która używa interfejsu API Microsoft Translator do tłumaczenia tekstu, który został wprowadzone przez użytkownika. Będziesz budować stronę za pomocą ASP.NET i wolna Visual Studio Express 2012 dla sieci Web. Jeśli masz już instalację programu Visual Studio, nadal będzie można wykonać samouczek, po prostu pomiń krok 1.

Przed rozpoczęciem należy zarejestrować się w usłudze Microsoft Translator API na platformie Azure. Istnieje wiele różnych ofert, w tym wolny jeden, i można zobaczyć, jak zarejestrować się do bezpłatnej usługi, zarejestruj swoją aplikację i uzyskać poświadczenia tutaj:

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

Identyfikator klienta i klucz tajny klienta, które wygenerujesz w tym miejscu będą używane w kroku 4, więc zachowaj ich notatkę.

Krok 1. Uzyskiwanie programu Visual Studio Express 2012 dla sieci Web.

Najlepszym sposobem na rozpoczęcie jest wizyta http://www.asp.net/downloads i wybierz przycisk "Zainstaluj teraz" w sekcji "Pobierz wszystko z jedną prostą instalację".

Spowoduje to uruchomienie Instalatora platformy sieci Web, który zainstaluje program Visual Studio, ASP.NET, MVC i cały szereg innych dodatków, których można używać do tworzenia witryn internetowych.

W kroku 2. Tworzenie aplikacji sieci Web

Uruchom program Visual Studio i z pliku menu, wybierz opcję "nowy projekt". Zobaczysz okno dialogowe zawierające listę różnych projektów, które są dostępne do tworzenia witryn sieci Web. Wybierz "Visual C#" po lewej stronie, a następnie wybierz "ASP.NET Web Forms Application" z listy.

Nadaj aplikacji sieci Web nazwę, taką jak "Translator", i naciśnij przycisk "OK". Program Visual Studio utworzy teraz wszystko, czego potrzebujesz do tworzenia i uruchamiania aplikacji sieci Web. Naciśnij F5, aby skompilować i uruchomić aplikację, a zobaczysz coś takiego:

Krok 3. Tworzenie interfejsu użytkownika dla translacji tekstu

W tej sekcji dodasz formanty do witryny, które zezwalają użytkownikom końcowym na wpisanie tekstu, naciśnięcie przycisku tłumaczenia, a następnie zobaczenie tłumaczenia wprowadzonego tekstu. Ten typ funkcji jest przydatny do interakcji z klientami, gdy mówisz różne języki, na przykład.

Z Eksploratora rozwiązań, Znajdź stronę "about. aspx". Otwórz go w projektancie, a zobaczysz coś takiego:

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:

Dla Twojej wygody, Oto Źródło dla tej strony:

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

<ASP: zawartość Runat= "serwer" IDENTYFIKATOR= "BodyContent" ContentPlaceHolderID= "MainContent">
    <hgroup Klasa= "tytuł">
        <h1><%: Tytuł %>.</h1>
        <h2>Strona opisu aplikacji.</h2>
    </hgroup>

    <Artykułu>
        Wpisz tekst, który chcesz przetłumaczyć:<Br />
        <ASP: pole tekstowe IDENTYFIKATOR= "TextBox1" Runat= "serwer" Wysokość= "25px" Szerokość= "342px"></ASP: pole tekstowe>
        <ASP: przycisk IDENTYFIKATOR= "Button1" Runat= "serwer" Wysokość= "37px" Onclick= "Button1_Click" Tekst= "Przetłumacz" />
        <Br />
        Przetłumaczony tekst jest:<Br />
        <ASP: literał IDENTYFIKATOR= "Literal1" Runat= "serwer"></ASP: literał>
    </Artykułu>

    <Bok>
        <h3>Bok tytuł</h3>
        <P>        
            Użyj tego obszaru, aby podać dodatkowe informacje.
        </P>
        <Ul>
            <Li><A Runat= "serwer" Href="~/">W: strona główna</A></Li>
            <Li><A Runat= "serwer" Href= "~/About.aspx">O</A></Li>
            <Li><A Runat= "serwer" Href= "~/Contact.aspx">Kontakt</A></Li>
        </Ul>
    </Bok>
</ASP: zawartość>

Należy pamiętać, że w projektancie należy dwukrotnie kliknąć na przycisk, aby wygenerować kod "Button1_Click". Piszesz ten kod w następnym kroku.

W kroku 4. Pisanie kodu do tłumaczenia tekstu użytkownika

W poprzedniej sekcji utworzono podstawowy interfejs użytkownika dla translacji tekstu. Umożliwiłoby to użytkownikowi napisanie jakiegoś tekstu i naciśnięcie przycisku. W tej sekcji piszesz kod za tym przyciskiem, który przetłumaczy żądany tekst użytkownika na język hiszpański i renderuje go na stronie.

Najpierw należy dodać nową klasę do rozwiązania. Zadzwoń Właściwość AdmAccessToken i nadaj mu następujący kod:

Za pomocą System
Za pomocą System. Collections. Generic;
Za pomocą System. LINQ;
Za pomocą System. Web;

Obszaru nazw Translator
{
    Publicznego Klasa AdmAccessToken
    {
        Publicznego Ciąg access_token { get; set; }
        Publicznego Ciąg token_type { get; set; }
        Publicznego Ciąg expires_in { get; set; }
        Publicznego Ciąg scope { get; set; }
    }
}

Należy zauważyć, że nazwy ciągów 4 powinny być zgodne, co jest tutaj dokładnie, lub otrzymasz błędy w kodzie później.

Następnie w programie Visual Studio w Eksploratorze rozwiązań kliknij prawym przyciskiem myszy folder "References" i wybierz polecenie "Dodaj odwołanie". Użyj następującego okna dialogowego, aby dodać odwołania do

– System. Runtime. Serialization

– System. XML. LINQ

– System. ServiceModel. Web

W górnej części kodu dla About.aspx.cs, zobaczysz kilka instrukcji "Using". Dodaj za pomocą System. XML. LINQ do tych, tak, że wygląda tak:

Za pomocą System
Za pomocą System. Collections. Generic;
Za pomocą System. LINQ;
Za pomocą System. Web;
Za pomocą System. Web. UI;
Za pomocą System. Web. UI. WebControls;
Za pomocą System. XML. LINQ;

Obszaru nazw Translator
{
    Publicznego Częściowe Klasa About : Page
    {
        Chronione Void Page_Load (wObiektu nadawca, EventArgs e)
        {

}

        Chronione Void Button1_Click (Obiektu nadawca, EventArgs e)
        {

}
    }
}

Zobaczysz, że Button1_Click kod jest pusty. Dodaj do niego następujący kod. Ten kod otrzyma token dostępu dla usługi translator, przy użyciu identyfikatora klienta i klucz tajny klienta, który został utworzony wcześniej na.

Ciąg clientID = "<Your ClientID>";
Ciąg clientSecret = "<Your Client Secret>";
StrTranslatorAccessURI ciąg = 
      "https://datamarket.accesscontrol.windows.net/v2/OAuth2-13";
StrRequestDetails ciąg = 
      Ciąg. Formacie"grant_type=client_credentials&client_id={0}&client_secret={1} &scope=http://api.microsofttranslator.com", HttpUtility. UrlEncode (clientID), HttpUtility. UrlEncode (clientSecret));

System .NET. WebRequest webRequest = system .NET. WebRequest. Create (strTranslatorAccessURI);
webRequest. ContentType = "aplikacja/x-www-form-urlencoded";
webRequest. Method = POST;
Bajtów[] bajty = system. Text. Encoding. ASCII. GetBytes (strRequestDetails);
webRequest. ContentLength = bajtów. Długość
Za pomocą (System.IO.Stream outputStream = webRequest.GetRequestStream())
{
  outputStream.Write(bytes, 0, bytes.Length);
}

System.Net.WebResponse webResponse = webRequest.GetResponse();
System.Runtime.Serialization.Json.DataContractJsonSerializer serializer = Nowy 
    System. Runtime. Serialization. JSON. DataContractJsonSerializer (Typeof(AdmAccessToken));

AdmAccessToken token = (AdmAccessToken) serializator. ReadObject (webResponse. GetResponseStream ());

Ciąg headerValue = Okaziciela + token. access_token;

Ten kod tworzy POST do usługi rynku danych, przekazując swój identyfikator i klucz tajny i pobieranie obiektu JSON z powrotem. Następnie deserializacji tego obiektu do AdmAccessToken. Następnie można wyprowadzić access_token z tego.

Token ten jest następnie dodawany do ciągu, poprzedzony "Bearer" (nie zapomnij o spacji), aby utworzyć wartość nagłówka, który zostanie wysłany do usługi translatora.

Aby następnie wywołać usługę translator z tym headerValue, i przekazać tekst użytkownika, będziesz używać kodu w ten oto:

Ciąg txtToTranslate = TextBox1. Text;
Ciąg Identyfikator URI = "http://api.microsofttranslator.com/v2/Http.svc/Translate?text =" + System. Web. HttpUtility. UrlEncode (txtToTranslate) + "& from = EN & to = es";
System .NET. WebRequest translationWebRequest = system .NET. WebRequest. Create (URI);
translationWebRequest. Headers. Add (Autoryzacji, headerValue);

System .NET. WebResponse odpowiedzi = Null;
odpowiedź = translationWebRequest. GetResponse ();
Strumień system. IO. Stream = odpowiedź. GetResponseStream ();
System. Text. Encoding Encode = system. Text. Encoding. GetEncoding ("UTF-8");

System. IO. StreamReader translatedStream = Nowy System. IO. StreamReader (strumień, kodowanie);
System. XML. XmlDocument xTranslation = Nowy System. XML. XmlDocument ();
xTranslation. LoadXml (translatedStream. ReadToEnd ());

Literal1. Text = xTranslation. InnerText;

Pole tekstowe było nazywane "TextBox1", więc tekst wpisany przez użytkownika może po prostu pochodzić od tego. Po tym identyfikator URI do usługi Translator HTTP jest tworzony, a sam tekst jest UrlEncoded i dodane do identyfikatora URI.

Zauważ, że język "en" jest używany dla "od" (tj., Jestem zakładając, że piszesz w języku angielskim), a "es" jest używany dla "to" (tj. będzie przetłumaczyć na język hiszpański). Pełna lista tych kodów dla obsługiwanych języków jest tutaj: http://msdn.microsoft.com/en-us/library/hh456380.aspx

Usługa translator zwraca XML, więc kod wywołuje usługę, pobiera odpowiedź jako XML, a następnie dekoduje go do tekstu. Następnie ładuje wynik do Literal utworzony na about. aspx o nazwie Literal1.

Możesz zobaczyć to w akcji tutaj:

I to jest to! Teraz użyto interfejsu API Microsoft translator, aby dodać tłumaczenie maszynowe do aplikacji ASP.NET.

Krótki opis

W tym przewodniku przedstawiono sposób tworzenia aplikacji sieci Web przy użyciu ASP.NET i jak dodać do niego tłumaczenia maszynowego. Użyto Microsoft Translator widget do zapewnienia tłumaczenia zawartości strony i zobaczyłem, jak program Microsoft Translator API przy użyciu języka C# w celu tłumaczenia treści generowane przez użytkownika.

Blog Microsoft Translator