Share
In questo tutorial ti spiegherò come scrivere un widget Twitter per ASP.NET sotto forma di un controllo server riutilizzabile completo di cose carine come trasformare automaticamente gli URL in link e il caching per accelerare i tempi di caricamento delle pagine.
Per seguire questo tutorial, tutto ciò che serve è Visual Studio (puoi usare MonoDevelop se non sei su Windows, anche se non ci sono garanzie lì.) Se non vuoi sborsare soldi per la versione completa di Visual Studio, puoi prendere l'Express Edition gratuita.
Avrai anche bisogno della conoscenza di C # 3.0, poiché questo tutorial utilizza alcune delle nuove funzionalità del linguaggio, come le espressioni lambda e il var parola chiave.
ASP.NET include una comoda funzionalità nota come Controlli server. Si tratta di tag personalizzati che mirano ad aiutare gli sviluppatori a strutturare il loro codice. Quando viene richiesta una pagina che utilizza un controllo server, il runtime ASP.NET esegue il Render () metodo e include l'output nella pagina finale.
Dopo aver creato una nuova applicazione Web in Visual Studio, fare clic con il tasto destro del mouse su Solution Explorer e aggiungere un nuovo elemento alla soluzione. Selezionare Controllo server ASP.NET e assegnargli un nome. Ecco, l'ho chiamato Twidget.cs, ma puoi chiamarlo come preferisci. Incolla il seguente codice e non preoccuparti se tutto sembra un po 'estraneo - Spiegherò tutto a breve.
Accentsconagua
usando il sistema; using System.Collections.Generic; using System.Linq; usando System.Web; usando System.Web.UI; utilizzando System.Web.Script.Serialization; usando System.Net; namespace WebApplication1 public class Twidget: Control public string Account get; impostato; public int Tweets get; impostato; protected override void Render (HtmlTextWriter writer) writer.Write ("Questo è fondamentale come puoi ottenere per un widget di Twitter. Ecco come funziona:
Quando un utente richiede una pagina con questo controllo su di essa, il Render () il metodo viene eseguito con a HtmlTextWriter passato come parametro. Scrive il tag, quindi entra in un ciclo che stampa ciascun tweet come elemento della lista. La magia qui accade nel GetTweets () metodo. Nota come stiamo usando il Prendere() metodo di estensione per assicurarci di stampare solo la quantità di tweet che ci viene richiesta.
Una volta che l'esecuzione passa al GetTweets () metodo, abbiamo impostato a Lista> string< tenere i nostri tweets e a JavaScriptSerializer analizzare il JSON dai server API di Twitter. La dichiarazione alle righe 31 - 34 (suddivisa per leggibilità) riporta la timeline dell'utente in formato JSON, quindi deserializza in tipi .NET con cui possiamo lavorare. Alla riga 36, passiamo in rassegna tutti i tweet e li aggiungiamo uno alla volta nell'elenco dei tweet. Dobbiamo lanciare manualmente x [ "testo"] a a stringa perché lo abbiamo deserializzato come un oggetto. Dovevamo fare questo, perché il JSON restituito dall'API di Twitter utilizza un pannello di smistamento di diversi tipi - che va bene per JavaScript, ma un po 'complicato con C #.
Ora abbiamo il codice per il nostro widget Twitter; mettiamola per usare! Apri i tuoi Default.aspx pagina (o qualsiasi pagina in cui si desidera utilizzare questo in) e inserire il seguente codice immediatamente dopo il <%@ Page %> direttiva:
<%@ Register TagPrefix="widgets" Namespace="WebApplication1" Assembly="WebApplication1" %>
Sentiti libero di cambiare il TagPrefix a qualsiasi cosa ti piaccia, ma assicurati che il Spazio dei nomi l'attributo è impostato correttamente su qualsiasi spazio dei nomi in cui è stato inserito il codice del widget e assicurarsi che montaggio l'attributo è impostato sul nome della tua applicazione web (nel nostro caso, WebApplication1).
Una volta registrato il prefisso del tag appropriato (e dovrai farlo per ogni pagina in cui desideri utilizzare il controllo), puoi iniziare a usarlo. Incolla il seguente codice da qualche parte nella tua pagina, e ancora una volta, sentiti libero di cambiare gli attributi in qualunque cosa desideri:
Se hai fatto tutto correttamente, dovresti vedere una pagina simile a questa quando esegui la tua applicazione web:
Devi ammettere che il controllo che abbiamo al momento è piuttosto rudimentale. Non deve essere però, quindi diamo un po 'di risalto trasformando gli URL in link piacevoli e cliccabili per i tuoi visitatori.
Trova il ciclo di foreach in Render () metodo e scaricalo completamente. Sostituiscilo con questo:
// dovrai aggiungere questo usando la direttiva all'inizio del file: using System.Text.RegularExpressions; foreach (var in GetTweets (). Take (Tweets)) string s = Regex.Replace (HttpUtility.HtmlEncode (t), @ "[az] +: // [^ \ s] +", x => " "+ x.Value +" ", RegexOptions.Compiled | RegexOptions.IgnoreCase); writer.Write ("È tutto più o meno lo stesso codice, fatta eccezione per l'enorme chiamata a Regex.Replace () sulla linea 6. Spiegherò cosa fa.
Il primo parametro è l'input o la stringa su cui lavora il Regex. In questo caso, è solo il testo tweet dopo essere passato attraverso HttpUtility.HtmlEncode () quindi non cadiamo vittima di un attacco XSS vizioso. L'input viene quindi confrontato con il secondo parametro che è un'espressione regolare progettata per corrispondere a un URL.
Il terzo parametro è dove diventa un po 'coinvolto. Questa è un'espressione lambda, una novità del C # 3. È fondamentalmente un modo molto breve per scrivere un metodo come questo:
public static string SomeFunction (Match x) return "" + x.Value + "";
Tutto ciò che fa è racchiudere l'URL con un tag, di cui tutte le virgolette nell'URL sono sostituite con l'entità HTML ", che aiuta a prevenire gli attacchi XSS. Il quarto e ultimo parametro è solo un Oinsieme una coppia di bandiere che regolano il modo in cui si comporta la nostra regex.
L'output del controllo dopo aver effettuato questa regolazione è in qualche modo simile allo screenshot qui sotto.
C'è un grosso problema con il codice che ti ho dato sopra, e cioè che non memorizza nella cache la risposta dall'API di Twitter. Ciò significa che ogni volta che qualcuno carica la tua pagina, il server deve fare una richiesta all'API di Twitter e attendere una risposta. Questo può rallentare notevolmente il tempo di caricamento della pagina e può anche renderti ancora più vulnerabile a un attacco di tipo Denial of Service. Per fortuna, possiamo aggirare tutto questo implementando un cache.
Sebbene la struttura di base del codice del controllo rimanga dopo l'implementazione del caching, ci sono troppe piccole modifiche da elencare, quindi ti fornirò l'intera fonte e poi, come al solito, spiegherò come funziona.
