Share
I den här handledningen går jag igenom hur du skriver en Twitter-widget för ASP.NET i form av en återanvändbar serverkontroll som är komplett med fina saker som att automatiskt ändra webbadresser till länkar och cache för att öka sidladdningstiderna.
För att följa denna handledning är allt du behöver Visual Studio (Du kan använda MonoDevelop om du inte är på Windows, även om det inte finns några garantier där.) Om du inte vill gaffla över pengar för den fullständiga versionen av Visual Studio, kan ta tag i den fria Express Edition.
Du behöver också kunskap om C # 3.0, eftersom denna handledning använder sig av några av de nyare funktionerna i språket, som lambda-uttryck och var nyckelord.
ASP.NET innehåller en praktisk funktion som kallas Server Controls. Dessa är anpassade taggar som syftar till att hjälpa utvecklare att strukturera sin kod. När en sida med serverstyrning begärs, kör ASP.NET runtime Göra() metod och inkluderar utmatningen på den sista sidan.
När du har skapat ett nytt webbprogram i Visual Studio högerklickar du i lösningsutforskaren och lägger till ett nytt objekt i lösningen. Välj ASP.NET Server Control och ge det ett namn. Här har jag ringt det Twidget.cs, men du är välkommen att ringa det vad du vill. Klistra in följande kod och oroa dig inte om det hela ser lite utländskt - jag kommer att förklara det hela inom kort.
Accentsconagua
använder system; använder System.Collections.Generic; använder system.Linq; använder System.Web; använder System.Web.UI; använder System.Web.Script.Serialization; använder System.Net; namespace WebApplication1 public class Twidget: Control public string Konto get; uppsättning; public int Tweets get; uppsättning; skyddad åsidosätt tomt Render (HtmlTextWriter-skribent) writer.Write ("Detta är ungefär lika grundläggande som du kan få för en Twitter-widget. Så här fungerar det:
När en användare begär en sida med den här kontrollen på den, Göra() Metoden utförs med a HtmlTextWriter passerade som en parameter. Det skriver ut tagg och går sedan in i en slinga som skriver ut varje tweet som en listobjekt. Den magiska här händer i GetTweets () metod. Lägg märke till hur vi använder Ta() förlängningsmetod för att se till att vi bara skriver ut den mängd tweets som vi är ombedda att.
När körningen passerar till GetTweets () metod, vi ställer in en Lista> string< att hålla våra tweets och a JavaScriptSerializer att analysera JSON från Twitter API-servrarna. Uttalandet på rad 31 - 34 (delas upp för läsbarhet) återställer användartidslinjen i JSON-format och deserialiserar sedan till .NET-typer som vi kan arbeta med. På rad 36 slogs vi igenom alla tweets och lägger dem en efter en till tweetlistan. Vi måste manuellt kasta x [ "text"] till a sträng för att vi deserialiserade det som en objekt. Vi var tvungna att göra det eftersom JSON som returneras av Twitter API använder ett smorgasboard av olika typer - vilket är bra för JavaScript, men lite knepigt med C #.
Nu har vi koden för vår Twitter-widget; låt oss använda den! Öppna din Default.aspx sida (eller vilken sida du vill använda detta i) och lägg följande kod direkt efter <%@ Page %> direktiv:
<%@ Register TagPrefix="widgets" Namespace="WebApplication1" Assembly="WebApplication1" %>
Känn dig fri att ändra TagPrefix till vad du vill, men se till att namespace Attributet är korrekt inställt på vilken namnrymd du placerat widgetkoden i och se till att hopsättning attributet är inställt på namnet på din webbapplikation (i vårt fall, WebApplication1).
När du har registrerat rätt taggprefix (och du måste göra det för varje sida du vill använda kontrollen på) kan du börja använda den. Klistra in följande kod någonstans på din sida, och än en gång gärna ändra attributen till vad du vill:
Om du har gjort allt ordentligt borde du se en sida som liknar detta när du kör din webbapplikation:
Du måste erkänna, den kontroll vi har för tillfället är ganska rudimentär. Det behöver inte vara så, så låt oss spiffy upp det lite genom att slå webbadresser till trevliga, klickbara länkar för dina besökare.
Hitta foreach loop i Göra() metod och skrapa det helt. Byt ut det med följande:
// Du måste lägga till det här med hjälp av direktivet till toppen av filen: med System.Text.RegularExpressions; string s = Regex.Replace (HttpUtility.HtmlEncode (t), @ "[az] +: // [^ \ s] +", x => " "+ x.Value +" ", RegexOptions.Compiled | RegexOptions.IgnoreCase); writer.Write ("Det är ganska mycket samma kod, förutom det humongous kallet till Regex.Replace () på rad 6. Jag ska förklara vad det här gör.
Den första parametern är ingången, eller strängen som Regex fungerar på. I det här fallet är det bara tweettexten efter att ha gått igenom HttpUtility.HtmlEncode () så vi blir inte offer för en ond XSS-attack. Inmatningen matchas sedan mot den andra parametern, vilket är ett regelbundet uttryck som är utformat för att matcha en webbadress.
Den tredje parametern är där det blir lite involverat. Detta är ett lambda-uttryck, en funktion som är ny på C # 3. Det är i grunden en mycket kort sätt att skriva en metod så här:
statisk statisk sträng SomeFunction (Match x) return "" + x.Value + "";
Allt det gör är att sätta in webbadressen med en tagg, varav alla citattecken i webbadressen ersätts med HTML-enheten ", vilket hjälper till att förhindra XSS-attacker. Den fjärde och sista parametern är bara en ELLERed tillsammans två flaggor som justerar hur vår regex beter sig.
Utgången från kontrollen efter att ha gjort denna justering ligner på något sätt skärmbilden nedan.
Det finns ett stort problem med koden som jag har gett dig ovan, och det betyder att det inte cachar svaret från Twitter API. Det innebär att varje gång någon laddar din sida måste servern lämna en förfrågan till Twitter API och vänta på ett svar. Detta kan sakta ner din sidlastningstid dramatiskt och kan också leda till att du är ännu mer sårbar för en Denial of Service-attack. Tack och lov kan vi arbeta runt allt detta genom att implementera en cache.
Även om den grundläggande strukturen i kontrollens kod kvarstår efter genomförandet av cachning, finns det för många små ändringar i listan, så jag ger dig hela källan och sedan - som vanligt - förklara hur det fungerar.
