Creazione di un'applicazione Web con traduzione fornita da Microsoft Translator.
Creazione di un'applicazione Web con traduzione fornita da Microsoft Translator.
In questa procedura dettagliata verrà illustrato come creare un'applicazione Web che utilizza l'API Microsoft Translator per tradurre il testo immesso dall'utente. La pagina verrà costruita utilizzando ASP.NET e il Visual Studio Express 2012 gratuito per Web. Se si dispone già di un'installazione di Visual Studio, sarà comunque possibile seguire l'esercitazione, basta saltare il passaggio 1.
Prima di iniziare, è necessario registrarsi per l'API di Microsoft Translator in Azure. Ci sono una serie di offerte diverse, tra cui uno gratuito, e si può vedere come iscriversi per il servizio gratuito, registrare la vostra applicazione e ottenere le credenziali qui:
http://blogs.msdn.com/b/translation/p/gettingstarted1.aspx
L'ID client e il segreto client che si generano qui verranno utilizzati nel passaggio 4, quindi tenere una nota di essi.
Passo 1. Ottenere Visual Studio Express 2012 per Web.
Il modo migliore per iniziare è visitare http://www.asp.net/downloads e seleziona il pulsante ' Installa ora ' nella sezione ' Ottieni tutto con una semplice installazione '.
Questo avvierà il programma di installazione della piattaforma Web che installerà Visual Studio, ASP.NET, MVC e tutta una serie di altre chicche che è possibile utilizzare per creare siti Web.
Passaggio 2. Creare l'applicazione Web
Eseguire Visual Studio e dal menu file, selezionare "nuovo progetto". Verrà visualizzata una finestra di dialogo contenente un elenco di diversi progetti disponibili per la creazione di siti Web. Selezionare ' Visual C#' a sinistra, quindi selezionare ' ASP.NET Web Forms Application ' dall'elenco.
Assegnare un nome all'applicazione Web, ad esempio ' Translator ', e premere ' OK '. Visual Studio creerà ora tutto il necessario per compilare ed eseguire l'applicazione Web. Premere F5 per compilare ed eseguire l'applicazione e vedrete qualcosa di simile:
Passo 3. Creazione dell'interfaccia utente per la traduzione testuale
In questa sezione, aggiungerai controlli al sito che consentono agli utenti finali di digitare un testo, premere un pulsante translate e quindi vedere la traduzione del testo immesso. Questo tipo di funzionalità è utile per interagire con i clienti quando si parla lingue diverse, ad esempio.
In Esplora soluzioni trovare la pagina ' about. aspx '. Aprirlo nella finestra di progettazione, e vedrete qualcosa di simile:
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:
Per la vostra convenienza, ecco la fonte per questa pagina:
<%@ Page Title="About" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="About.aspx.cs" Inherits="Translator.About" %> <ASP: contenuto Runat= "Server" ID= "BodyContent" ContentPlaceHolderID= "MainContent"> <hgroup Classe= "titolo"> <h1><%: Titolo %>.</h1> <h2>Pagina della descrizione dell'app.</h2> </hgroup> <articolo> Inserire il testo che si desidera tradurre:<Br /> <ASP: casella di testo ID= "TextBox1" Runat= "Server" Altezza= "25px" Larghezza= "342px"></ASP: casella di testo> <ASP: pulsante ID= "Button1" Runat= "Server" Altezza= "37px" Onclick= "Button1_Click" Testo= "Traduci" /> <Br /> Il testo tradotto è:<Br /> <ASP: valore letterale ID= "Literal1" Runat= "Server"></ASP: valore letterale> </articolo> <Parte> <h3>A parte il titolo</h3> <P> Utilizzare quest'area per fornire informazioni aggiuntive. </P> <Ul> <li><Un Runat= "Server" Href="~/">Casa</Un></li> <li><Un Runat= "Server" Href= "~/About.aspx">Circa</Un></li> <li><Un Runat= "Server" Href= "~/Contact.aspx">Contatto</Un></li> </Ul> </Parte> </ASP: contenuto>
Si noti che nella finestra di progettazione è necessario fare doppio clic sul pulsante per generare il codice "Button1_Click". Scriverai questo codice nel passaggio successivo.
Passo 4. Scrittura di codice per tradurre il testo dell'utente
Nella sezione precedente è stata creata un'interfaccia utente di base per la conversione del testo. Permetterebbe all'utente di scrivere del testo e premere un pulsante. In questa sezione, scriverai il codice dietro quel pulsante che tradurrà il testo desiderato dell'utente in spagnolo e lo renderà nella pagina.
In primo luogo, è necessario aggiungere una nuova classe alla soluzione. Chiamalo Altro da AdmAccessToken e dargli il seguente codice:
Utilizzando Sistema Utilizzando System. Collections. Generic; Utilizzando System. Linq; Utilizzando System. Web; Namespace Translator { Pubblico Classe AdmAccessToken { Pubblico Stringa access_token { get; set; } Pubblico Stringa token_type { get; set; } Pubblico Stringa expires_in { get; set; } Pubblico Stringa scope { get; set; } } }
Si noti che i nomi delle 4 stringhe devono corrispondere a quello che è esattamente qui, o si otterrà errori nel codice in un secondo momento.
Successivamente, in Visual Studio, in Esplora soluzioni, fare clic con il pulsante destro del mouse sulla cartella ' References ' e selezionare ' Aggiungi riferimento '. Utilizzare questa finestra di dialogo che segue per aggiungere riferimenti a
– System. Runtime. Serialization
– System. XML. Linq
– System. ServiceModel. Web
Nella parte superiore del codice per About.aspx.cs, vedrai un numero di istruzioni ' using '. Aggiungere utilizzando System. XML. Linq a questi, in modo che assomigli a questo:
Utilizzando Sistema Utilizzando System. Collections. Generic; Utilizzando System. Linq; Utilizzando System. Web; Utilizzando System. Web. UI; Utilizzando System. Web. UI. WebControls; Utilizzando System. XML. Linq; Namespace Translator { Pubblico Parziale Classe About : Page { Protetto Vuoto Page_Load (Oggetto sender, EventArgs e) { } Protetto Vuoto Button1_Click (Oggetto sender, EventArgs e) { } } }
Vedrai che il codice Button1_Click è vuoto. Aggiungere il codice seguente. Questo codice otterrà il token di accesso per il servizio di traduzione, utilizzando l'ID client e il segreto client creato in precedenza.
Stringa clientID = "<Your ClientID>"; Stringa clientSecret = "<Your Client Secret>"; Stringa strTranslatorAccessURI = "https://datamarket.accesscontrol.windows.net/v2/OAuth2-13"; Stringa strRequestDetails = Stringa. Formato"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 = "Application/x-www-form-urlencoded"; webRequest. Method = POST; byte[] bytes = System. Text. Encoding. ASCII. GetBytes (strRequestDetails); webRequest. ContentLength = bytes. Lunghezza Utilizzando (System.IO.Stream outputStream = webRequest.GetRequestStream()) { outputStream.Write(bytes, 0, bytes.Length); } System.Net.WebResponse webResponse = webRequest.GetResponse(); System.Runtime.Serialization.Json.DataContractJsonSerializer serializer = Nuovo System. Runtime. Serialization. JSON. DataContractJsonSerializer (Typeof(AdmAccessToken)); AdmAccessToken token = (AdmAccessToken) serializzatore. ReadObject (webResponse. GetResponseStream ()); Stringa headerValue = Portatore + token. access_token;
Questo codice forma un POST al servizio di data Market, passando il tuo ID e segreto e ottenendo un oggetto JSON indietro. È quindi deserializzare tale oggetto in un AdmAccessToken. È quindi possibile derivare il access_token da questo.
Questo token viene quindi aggiunto a una stringa, preceduto da "Bearer" (non dimenticare lo spazio) per creare un valore di intestazione che verrà inviato al servizio di traduzione.
Per chiamare quindi il servizio di traduzione con questo headerValue e passare il testo dell'utente, si utilizzerà codice come questo:
Stringa txtToTranslate = TextBox1. Text; Stringa 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 (Autorizzazione, headerValue); Risposta di System .NET. WebResponse = Null; risposta = translationWebRequest. GetResponse (); Stream di System. IO. Stream = risposta. GetResponseStream (); System. Text. Encoding encode = System. Text. Encoding. GetEncoding ("UTF-8"); System. IO. StreamReader translatedStream = Nuovo System. IO. StreamReader (flusso, codifica); System. XML. XmlDocument xTranslation = Nuovo System. XML. XmlDocument (); xTranslation. LoadXml (translatedStream. ReadToEnd ()); Literal1. Text = Xtraduzione. InnerText;
La casella di testo è stata denominata ' TextBox1' in modo che il testo digitato dall'utente può semplicemente derivare da tale. Successivamente, viene creato un URI per il servizio HTTP Translator e il testo stesso è UrlEncoded e aggiunto all'URI.
Si noti che la lingua ' en ' viene utilizzata per ' from ' (cioè, sto assumendo che stai digitando in inglese), è es ' viene utilizzato per ' a' (cioè si tradurrà in spagnolo). L'elenco completo di questi codici per le lingue supportate è qui: http://msdn.microsoft.com/en-us/library/hh456380.aspx
Il servizio di traduzione restituisce XML, quindi il codice chiama il servizio, ottiene la risposta come XML e quindi lo decodifica in testo. Viene quindi caricato il risultato nel valore letterale creato in about. aspx denominato Literal1.
Si può vedere in azione qui:
E questo è tutto! È stata ora utilizzata l'API Microsoft Translator per aggiungere la traduzione automatica all'applicazione ASP.NET.
Riepilogo
In questa procedura dettagliata, è stato illustrato come creare un'applicazione Web utilizzando ASP.NET e come aggiungere la traduzione automatica. È stato utilizzato il Microsoft Translator widget per fornire la traduzione del contenuto della pagina e si è visto come programmare l'API di Microsoft Translator utilizzando C# per tradurre il contenuto generato dagli utenti.