Crearea unei aplicații web cu traducere furnizată de Microsoft Translator.
Crearea unei aplicații web cu traducere furnizată de Microsoft Translator.
În acest Walkthrough, veți învăța să creați o aplicație Web care utilizează Microsoft Translator API pentru a traduce text care a fost de intrare de către utilizator. Veți construi pagina folosind ASP.NET și gratuit Visual Studio Express 2012 pentru web. Dacă aveți deja o instalare Visual Studio, veți putea în continuare să urmăriți tutorialul, doar săriți peste pasul 1.
Înainte de a începe, va trebui să vă înregistrați pentru Microsoft Translator API în Azure. Există o serie de oferte diferite, inclusiv unul gratuit, și puteți vedea să vă înscrieți pentru serviciul gratuit, înregistrați aplicația și obțineți acreditările aici:
http://blogs.msdn.com/b/translation/p/gettingstarted1.aspx
ID-ul clientului și secretul clientului pe care îl generați aici vor fi utilizate în pasul 4, Deci păstrați o notă despre ele.
Pasul 1. Noțiuni de Visual Studio Express 2012 pentru web.
Cel mai bun mod de a începe este de a vizita http://www.asp.net/downloads și selectează butonul "instalează acum" din secțiunea "obțineți totul cu o simplă instalare".
Acest lucru va lansa web Platform Installer, care va instala Visual Studio, ASP.NET, MVC și o întreagă serie de alte bunatati pe care le puteți utiliza pentru a construi site-uri web.
Pasul 2. Creare aplicație Web
Executați Visual Studio și din meniul fișier, selectați "nou proiect". Veți vedea un dialog care conține o listă de proiecte diferite care sunt disponibile pentru a construi site-uri web. Selectați ' Visual C# ' din partea stângă, apoi selectați ' ASP.NET Web Forms Application ' din listă.
Dă-i aplicației Web un nume, ar fi Translator, și apasă OK. Visual Studio va crea acum tot ce ai nevoie pentru a construi și rula aplicația web. Apăsați F5 pentru a construi și rula aplicația și veți vedea ceva de genul:
Pasul 3. Crearea de UI pentru text Traducere
În această secțiune, veți adăuga controale la site-ul care permit utilizatorilor finali să tastați un text, să apăsați pe un buton de traducere, apoi să vedeți Traducerea textului pe care l-au introdus. Acest tip de funcționalitate este utilă pentru interacțiunea cu clienții atunci când vorbiți limbi diferite, de exemplu.
Din exploratorul de soluții, găsiți pagina ' About. aspx '. Deschideți-l în designer, și veți vedea ceva de genul asta:
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:
Pentru confortul dumneavoastră, aici e sursa pentru această pagină:
<%@ Page Title="About" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="About.aspx.cs" Inherits="Translator.About" %> <ASP: Continut runat= "Server" ID= "Body content" (ContentPlaceHolderID)= "MainContent"> <Grupul hgroup Clasa= "titlu"> <h1><%: Titlu %>.</h1> <h2>Pagina de descriere a aplicației.</h2> </Grupul hgroup> <Articol> Introdu textul pe care ai dori să-l traduci:<Br /> <ASP: casetă text ID= "TextBox1" runat= "Server" Înălțime= "25px" Lăţime= "342px"></ASP: casetă text> <ASP: buton ID= "Button1" runat= "Server" Înălțime= "37px" Onclick= "Button1_Click" Text= "Tradu" /> <Br /> Textul tradus este:<Br /> <ASP: literal ID= "Literal1" runat= "Server"></ASP: literal> </Articol> <Deoparte> <h3>În afară de titlu</h3> <P> Utilizați această zonă pentru a furniza informații suplimentare. </P> <ul> <Li><R runat= "Server" Href="~/">Acasă</R></Li> <Li><R runat= "Server" Href= "~/About.aspx">Despre</R></Li> <Li><R runat= "Server" Href= "~/Contact.aspx">Contact</R></Li> </ul> </Deoparte> </ASP: Continut>
Rețineți că în proiectantul ar trebui să faceți dublu clic pe buton pentru a genera codul "Button1_Click". Vei scrie acest cod în pasul următor.
Pasul 4. Scrierea codului pentru a traduce textul utilizatorului
În secțiunea anterioară, ați creat o interfață de bază pentru traducerea textului. Aceasta ar permite utilizatorului să scrie un text, și apăsați un buton. În această secțiune, veți scrie codul din spatele acelui buton care va traduce textul dorit al utilizatorului în limba spaniolă și îl poate reda în pagină.
În primul rând, va trebui să adăugați o nouă clasă la soluția dvs. Spune-i AdmAccessToken și dă-i următorul cod:
Utilizarea Sistem Utilizarea System. Collections. generic; Utilizarea System. LINQ; Utilizarea System. Web; Nume traducător { Publice Clasa AdmAccessToken { Publice Şir access_token { get; set; } Publice Şir token_type { get; set; } Publice Şir expires_in { get; set; } Publice Şir scope { get; set; } } }
Rețineți că numele de 4 siruri de caractere ar trebui să se potrivească cu ceea ce este aici exact, sau veți obține erori în codul de mai târziu.
Apoi, în cadrul Visual Studio, în Solution Explorer, faceți clic dreapta pe folderul "Referințe" și selectați "Adăugați referință". Utilizați acest dialog care urmează pentru a adăuga referințe la
– Sistem. Runtime. Serialization
– System. XML. LINQ
– System. ServiceModel. Web
În partea de sus a codului pentru About.aspx.cs, veți vedea un număr de declarații "folosind". Adăugați folosind System. XML. LINQ la acestea, astfel încât să arate astfel:
Utilizarea Sistem Utilizarea System. Collections. generic; Utilizarea System. LINQ; Utilizarea System. Web; Utilizarea System. Web. UI; Utilizarea System. Web. UI. WebControls; Utilizarea System. XML. LINQ; Nume traducător { Publice Parţială Clasa About : Page { Protejate Nule Page_Load (Obiect expeditor, EventArgs e) { } Protejate Nule Button1_Click (Obiect expeditor, EventArgs e) { } } }
Veți vedea că codul Button1_Click este gol. Adăugați următorul cod la acesta. Acest cod va primi simbolul de acces pentru serviciul Translator, utilizând ID-ul client și secretul client pe care l-ați creat mai devreme.
Şir clientID = "<Your ClientID>"; Şir clientSecret = "<Your Client Secret>"; String strTranslatorAccessURI = "https://datamarket.accesscontrol.windows.net/v2/OAuth2-13"; Șir strRequestDetails = Şir. Format"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 = sistem .net. WebRequest. create (strTranslatorAccessURI); webRequest. ContentType = "cerere/x-www-form-urlencoded"; webRequest. method = POST; Octet[] bytes = System. text. codare. ASCII. GetBytes (strRequestDetails); webRequest. ContentLength = bytes. Lungime Utilizarea (System.IO.Stream outputStream = webRequest.GetRequestStream()) { outputStream.Write(bytes, 0, bytes.Length); } System.Net.WebResponse webResponse = webRequest.GetResponse(); System.Runtime.Serialization.Json.DataContractJsonSerializer serializer = Noi System. Runtime. Serialization. JSON. DataContractJsonSerializer (typeof(AdmAccessToken)); AdmAccessToken token = (AdmAccessToken) serializer. ReadObject (webResponse. GetResponseStream ()); Şir headerValue = Purtător + Token. access_token;
Acest cod formează un POST la serviciul de piață de date, trecând ID-ul și secretul și obținerea unui obiect JSON înapoi. Apoi deserializați acel obiect într-un AdmAccessToken. Puteți obține apoi access_token de la acest lucru.
Acest simbol este apoi adăugat la un șir, prefixat cu "purtător" (nu uitați spațiul) pentru a crea o valoare de antet care va fi trimisă la serviciul de traducător.
Pentru a apela apoi serviciul Translator cu acest headerValue, și trece textul utilizatorului, veți utiliza codul de genul:
Şir txtToTranslate = TextBox1. text; Şir uri = "http://api.microsofttranslator.com/v2/Http.svc/Translate?text =" + System. Web. HttpUtility. UrlEncode (txtToTranslate) + "& din = en & to = es"; System .net. WebRequest translationWebRequest = sistem .net. WebRequest. create (uri); translationWebRequest. Headers. Add (Autorizare, headerValue); System .net. WebResponse răspuns = Null; răspuns = translationWebRequest. GetResponse (); System. IO. Stream Stream = răspuns. GetResponseStream (); System. text. encoding codifica = System. text. encoding. GetEncoding ("UTF-8"); System. IO. StreamReader translatedStream = Noi System. IO. StreamReader (Stream, codifica); System. XML. XmlDocument xTranslation = Noi System. XML. XmlDocument (); xTranslation. LoadXml (translatedStream. ReadToEnd ()); Literal1. text = xTranslation. InnerText;
Caseta de text a fost numit "TextBox1", astfel încât textul de utilizator tastat în poate fi pur și simplu derivate din asta. După aceea, un URI la serviciul de traducător HTTP este creat, iar textul în sine este UrlEncoded și adaugă la URI.
Rețineți că limba "en" este folosit pentru "from" (de exemplu, eu sunt presupunând că sunteți tastând în limba engleză), și "es" este folosit pentru "la" (de exemplu, se va traduce în limba spaniolă). Lista completă a acestor coduri pentru limbile acceptate este aici: http://msdn.microsoft.com/en-us/library/hh456380.aspx
Serviciul Translator returnează XML, astfel încât codul apelează serviciul, primește răspunsul ca XML și apoi decodează în text. Apoi încarcă rezultatul în literal pe care l-ai creat pe About. aspx numit Literal1.
Puteți vedea în acțiune aici:
Și asta e tot! Acum ați utilizat Microsoft Translator API pentru a adăuga Traducerea mașinii la aplicația ASP.NET.
Rezumat
În acest ghid, ați văzut să construiască o aplicație web folosind ASP.NET și să adăugați traducerea mașină la acesta. Ați utilizat Microsoft Translator widget pentru a furniza traducerea conținutului paginii și ați văzut să programați Microsoft Translator API folosind C# pentru a traduce conținutul generat de utilizatori.