Integrating Twitter Into An ASP.NET WebsiteBy Scott Mitchell
|WARNING: This Article and Demo is Obsolete|
|This article demonstrates how to use Twitterizer version 1.0 to integrate an ASP.NET website with Twitter. Underneath the covers Twitterizer 1.0 uses basic authentication, an authentication mechanism that Twitter will stop supporting in June 2010. As of June 2010, Twitter will only support the OAuth protocol. The good news is that the Twitterizer library has been updated to support OAuth. Read Integrating Twitter Into An ASP.NET Website Using OAuth for more information.|
Twitter is a popular social networking web service for writing and sharing short messages. These tidy text messages are referred to as tweets and are limited to 140 characters. Users can leave tweets and follow other users directly from Twitter's website or by using the Twitter API. Twitter's API makes it possible to integrate Twitter with external applications. For example, you can use the Twitter API to display your latest tweets on your blog. A mom and pop online store could integrate Twitter such that a new tweet was added each time a customer completed an order. And ELMAH, a popular open-source error logging library, can be configured to send error notifications to Twitter.
Twitter's API is implemented over HTTP using the design principles of Representational State Transfer (REST). In a nutshell, inter-operating with the Twitter API involves a client - your application - sending an XML-formatted message over HTTP to the server - Twitter's website. The server responds with an XML-formatted message that contains status information and data. While you can certainly interface with this API by writing your own code to communicate with the Twitter API over HTTP along with the code that creates and parses the XML payloads exchanged between the client and server, such work is unnecessary since there are many community-created Twitter API libraries for a variety of programming frameworks.
This article shows how to integrate Twitter with an ASP.NET website using the Twitterizer library, which is a free, open-source .NET library for working with the Twitter API. Specifically, this article shows how to retrieve your latest tweets and how to post a tweet using Twitterizer. Read on to learn more!
An Overview of the Demo
The demo available for download at the end of this article shows how to use the Twitterizer API to integrate with Twitter from an ASP.NET website. Before we look at using Twitterizer to integrate, let's first take a moment to review the demo application. The demo consists of a single ASP.NET page,
Default.aspx, along with a master page,
Site.master. As the following screen shot shows, the master page and CSS rules define a layout that divides the screen into left and right portions. The right portion contains page-specific content. The left portion shows the most recent tweets from a specific Twitter user and appears on every page that uses the master page. There are five tweets in the screen shot below, the most recent one listed at the top - "Tweeting for fun and profit." What's more, the master page uses the ASP.NET Ajax Library's UpdatePanel and Timer Web controls to automatically and seamlessly refresh the list of latest tweets every 60 seconds.
Default.aspx page (shown above) includes a text box where the user can enter a post and have that sent to Twitter. Clicking the "Post My Tweet" button
causes a postback, and on postback the page uses Twitterizer to tweet the text entered into the text box. Also, the list of latest tweets is refreshed to include the just-tweeted
|aspIntegration, a Dummy Twitter Account|
When building this demo I created a dummy Twitter user account named aspIntegration. The username and password for this account are stored in the demo's |
Getting Started With Twitterizer
Using Twitterizer in one of your projects is easy - just download the Twitterizer assembly, copy it to your application's
/Binfolder, and start coding! The download available at the end of this article includes the latest version of Twitterizer at the time of writing, version 184.108.40.206. To get the latest version of Twitterizer, visit the project page at http://code.google.com/p/twitterizer/.
The Twitterizer library contains a number of classes that model the information exchanged between the client and the server when making Twitter API calls, along with the
low-level plumbing necessary to make the HTTP requests and to serialize the object model into the appropriate XML and vice-a-versa. The main workhorse of the library is the
From there, you can use any of the
To make a tweet for username, use the following code:
It's that simple. With Twitterizer you don't need to muck around with XML. Instead, you work with a tidy object model with all of the benefits therein (compile-time type checking, IntelliSense, no magic strings, and so forth). For a complete rundown of how to use Twitterizer to accomplish various Twitter-related tasks, refer to the Getting Started page on the Twitterizer Wiki.
Displaying Recent Tweets
Site.mastermaster page defines the markup and code used to display the configured user's most recent tweets. The latest tweets are displayed using a ListView control, although the markup could certainly be rendered iteratively, by using a Repeater, or through some other mechanism. The master page's source code portion contains a public method named
RefreshTweetsthat, when called, uses the Twitterizer library to go and get the user's most recent tweets; this collection of tweets is then bound to the ListView control.
The markup to display the latest tweets follows. The data-binding syntax is highlighted in red. Keep in mind that the ListView is being
bound to a list of
TwitterStatus objects. The
TwitterStatus class has properties like
Created, which return the
text of the tweet and the date and time is was posted, respectively. There's also a
TwitterUser property, which returns a
TwitterUser object with information about the
user who posted the tweet. To reference these properties, use the data-binding syntax
<%# Eval("propertyName") %>.
Check out the formatting function
RelativeTime takes in an absolute time -
(the date and time the tweet was made), compares it to the current time, and generates a relative time value. For example, if a tweet was made on February 17th, 4:50 PM GMT
and the current universal time is February 17th, 5:01 PM GMT, the
RelativeTime method will return the string, "about 6 minutes ago."
The ListView of tweets is contained inside of an UpdatePanel control, which also contains a Timer. The Timer is configured to "tick" every 60 seconds. Whenever the Timer control
"ticks" it causes a postback; because the Timer is in an UpdatePanel it's a partial page postback. On postback, the Timer's
Tick event fires and the event handler
runs. This event handler calls the
RefreshTweets method, which uses Twitterizer to reload the most recent tweets in the ListView. Long story short, this setup will
seamlessly requery Twitter every 60 seconds. Any new tweets will automatically appear in the ListView. For more information on using the Timer control to seamlessly update
web page content, check out Building Interactive User Interfaces with Microsoft ASP.NET AJAX: Using the Timer Control.
|Returning Fewer Tweets|
By default, Twitterizer's |
Bear i mind that the Twitter API does not allow more than 20 tweets to be returned in one API call. However, you can use the
Tweeting From The Website
Default.aspxpage includes a text box and button. When the button is clicked, a postback ensues and the contents entered into the text box are posted to the configured user's Twitter account. When posting tweets it is important to keep in mind that Twitter limits tweets to 140 characters. The markup in
Default.aspxincludes a RegularExpressionValidator that ensures the text entered is between 0 and 140 characters.
Posting a tweet using the Twitterizer library can be done with just one line of code (once the
Update method, passing in the text to tweet. Here is a code snippet from the demo that shows how to programmatically post the contents of the
TextBox to Twitter using Twitterizer:
Each tweet in Twitter includes information as to where the tweet came from. For instance, if you post from Twitter's website the tweet will say, "from web." By default,
tweets made from the Twitterizer library report that the tweet came from Twitterizer, as you might expect. The source of the tweet is configurable from the
which can be passed into the
Alternatively, if you put in a random string here that does not map to any known registered application, Twitter will report that the tweet came from the web. To go this route, you can pass in a new GUID as the source, since it is safe to assume that there are no registered applications with the same name. To accomplish this, use code like the following:
Like many social networking websites, Twitter offers a rich API for integration. There are numerous free, open-source libraries available for integrating with Twitter. One such library for the .NET Framework is Twitterizer. This article (and its accompanying demo) showed how to use Twitterizer to view the latest tweets in an ASP.NET website, along with how to post a tweet from a website. The concepts discussed here would work equally well with any other sort of connected application, such as a WinForms or WPF application, or from a WCF or Windows Service.