OAuth for Dummies

Having developed a little feature where I had to publish a Tweet to uh… Twitter, I did a checkup on how OAuth actually works. If you have the time you can go through Beginner’s Guide to OAuth, which is really excellent and was my source or introduction to OAuth. I’ll just condense it a little further, mostly because it is a good way to actually “get it”.

What is OAuth?

OAUth makes it possible for providers to communicate in a secure and authenticated manor, without needing to share user secrets (username/password). For example it can allow the users of my web application to post Tweets to their Twitter account without needing to specify their username and password (except if the need to login to the Twitter site).

Who is involved?

Just to set the scene and get into the terms used, the actors involved are:

We want to get access to the Service Provider, e.g. Twitter.

The Consumer would like to access a resource on the Service Provider, e.g. my application.

The User want to access a resource on the Service Provider via the Consumer, e.g. post a Tweet using my application.

How does it work?

Seen from a larger perspective the idea is that the 3 actors (the Service Provider, the Consumer and the User) communicate with each other in such a way that all agree on who is who.

In more technical terms, all 3 actors generates and present various tokens (share secrets) to each other, which when combined establishes a trusted relationship between the Consumer and the Service Provider on behalf of the User.

Step-by-Step

A User want to perform an action on the Consumer which requires access to the/a protected resource on the Service Provider, e.g. create a Tweet.

  1. The Consumer contacts the Service Provider, requesting a Request Token and a Request Secret.
  2. The User (e.g. his/her browser) is then redirected to the Service Provider presenting the Request Token.
  3. The Service Provider validates the user and request approval from the User that the Consumer (found via the Request Token) can access the User’s protected resource.
  4. The Service Provider generates an Access Token and an Access Secret.
  5. The User (e.g. his/her browser) is then redirected to the Consumer, presenting the Access Token (the Access Secret is kept um… secret).
  6. The Consumer now takes the Access Token and the Request Secret and asks the Service Provider for the Access Secret.
  7. Once the Consumer has the Access Token and the Access Secret, it can access the protected resource.

The point of presenting the Request Secret to the Service Provider in step 6 is so that replays cannot be performed using the Access Token alone.

The Tokens are used to communicate between the Consumer and the Service Provider via the User (his/her browser). The Secrets are kept between the Consumer and the Service Provider.

Now what?

Once the relationship is in place, the “real” communication can take place. This is where it gets hairy and where we’ll stop for this dummy introduction.

However during my implementation I found a little problem with the way .NET UrlEncode works – it is simply not compatible with OAuth. I found an implementation by Andrew Arnott, who is OAuth/OpenID aficionado and author of DotNetOpenAuth that does this and is RFC 3986 compliant (it basically used the UrlEncode from .NET and then fixes what is broken):

/// <summary>
/// The set of characters that are unreserved in RFC 2396 but are NOT unreserved in RFC 3986.
/// </summary>
private static readonly string[] UriRfc3986CharsToEscape = new[] { "!", "*", "'", "(", ")" };

/// <summary>
/// Escapes a string according to the URI data string rules given in RFC 3986.
/// </summary>
/// <param name="value">The value to escape.</param>
/// <returns>The escaped value.</returns>
/// <remarks>
/// The <see cref="Uri.EscapeDataString"/> method is <i>supposed</i> to take on
/// RFC 3986 behavior if certain elements are present in a .config file.  Even if this
/// actually worked (which in my experiments it <i>doesn't</i>), we can't rely on every
/// host actually having this configuration element present.
/// </remarks>

public static string UrlEncodeRfc3986(this string value)
{
    // Start with RFC 2396 escaping by calling the .NET method to do the work.
    // This MAY sometimes exhibit RFC 3986 behavior (according to the documentation).
    // If it does, the escaping we do that follows it will be a no-op since the
    // characters we search for to replace can't possibly exist in the string.
    var escaped = new StringBuilder(Uri.EscapeDataString(value));

    // Upgrade the escaping to RFC 3986, if necessary.
    for (int i = 0; i < UriRfc3986CharsToEscape.Length; i++)
    {
        escaped.Replace(UriRfc3986CharsToEscape[i], Uri.HexEscape(UriRfc3986CharsToEscape[i][0]));
    }

    // Return the fully-RFC3986-escaped string.
    return escaped.ToString();
}

ISO 8601/RFC 3339 Compatible Dates

There are not standard format specifiers for date that takes a date and converts it to an ISO 8601 or RFC 3339 compatible date. Here are two extension methods that does just that.

public static string ToISO8601(this DateTime date)
{
    return date.ToString("yyyy-MM-dd");
}

public static string ToRFC3339(this DateTime date)
{
    return date.ToUniversalTime().ToString("yyyy-MM-ddThh:mm:ssZ");
}

Generating a Slug From a String

I can’t (and won’t) take full credit for this extension method. The hardcore Unicode stuff is from Michael Kaplan’s blog (jeez, he is hardcore). There is a little danish “stuff” included, for special characters æ, ø and å, which can also be written “ae”, “oe” an “aa”.

public static string ToSlug(this string message)
{
    // replace space with -
    message = Regex.Replace(message, @"[\s/\\\.,+|_]+", "-");

    // normalize the message 
    message = message.Normalize(NormalizationForm.FormD);
    message = message.Replace("ø", "oe").Replace("Ø", "Oe").Replace("æ", "ae").Replace("Æ", "Ae").Replace("å", "aa").Replace("Å", "Aa");

    StringBuilder result = new StringBuilder();
    for (int i = 0; i < message.Length; i++)
    {
        UnicodeCategory uc = CharUnicodeInfo.GetUnicodeCategory(message[i]);
        if (uc != UnicodeCategory.NonSpacingMark)
        {
            result.Append(message[i]);
        }
    }
    return Regex.Replace(result.ToString().Normalize(NormalizationForm.FormC), @"[^a-zA-Z0-9\-]", "").ToLower();
}

ASP.NET MVC Gravatar HtmlHelper

Here is a quick little URL Helper extension method to add Gravatar images/photos/avatars to your page:

public static string GravatarUrl(this UrlHelper url, string email, int size)
{
    string imageUrl = ConfigurationManager.AppSettings["DefaultGravatar"];
    if (imageUrl.StartsWith("~/"))
    {
        imageUrl = url.Absolute(imageUrl);
    }

    if (string.IsNullOrEmpty(email))
    {
        return imageUrl;
    }

    string md5 = email.ToLowerInvariant().MD5();
    return string.Format(
        "http://www.gravatar.com/avatar/{0}.jpg?d={1}&s={2}&r=g",
        md5.ToLowerInvariant(),
        url.Encode(imageUrl),
        size);
}

public static string GravatarUrl(this UrlHelper url, string email)
{
    return url.GravatarUrl(email, 32);
}

It uses another custom URL Helper extension method Absolute to generate an absolute URL to a default image (based on an application relative url).

The Absolute extension method is similar to the ActionAbsolute method I posted earlier:

public static string Absolute(this UrlHelper url, string contentUrl)
{
    return new Uri(GetBaseUrl(url), url.Content(contentUrl))
        .AbsoluteUri;
}

And it also used the MD5 extension method from yesterdays post.


MD5 Extension Method

A nifty little extension method that generated the MD5/SHA-1 hash of a string. These methods are a continuation of my previous post:

public static string MD5(this string value)
{
    System.Security.Cryptography.MD5 algorithm =
        System.Security.Cryptography.MD5.Create();

    byte[] data = Encoding.ASCII.GetBytes(value);
    data = algorithm.ComputeHash(data);
    string md5 = "";
    for (int i = 0; i < data.Length; i++)
    {
        md5 += data[i].ToString("x2").ToLower();
    }

    return md5;
}

Just substitute MD5 for SHA1, SHA256, SHA384, SHA512 or RIPEMD160 which ever hash algorithm fits your needs.


Relative Time Description

Showing an absolute date on a webpage, e.g. January 22, 2009 13:01, is of course a very normal way to do it, apart from various different date formats, it is easily read and consumed. However if the date is shown in a context where the absolute date is of little importance, but it is more important to know if it was a long time ago, just now or maybe just in a couple of minutes, a relative and more descriptive method is better.

For example the date mentioned above might be described as “8 months ago”. Just by giving it a quick glance you get an idea about when this event occurred.

For this here are a couple of extension methods that generate this descriptive text based on a given time:

public static string ToRelativeTime(this DateTime from)
{
    DateTime now = DateTime.Now;
    return from.ToRelativeTime(now);
}

public static string ToRelativeTime(this DateTime from, bool usePreAndSuffix)
{
    DateTime now = DateTime.Now;
    return from.ToRelativeTime(now, usePreAndSuffix);
}

public static string ToRelativeTime(this DateTime from, DateTime to)
{
    return from.ToRelativeTime(to, true);
}

public static string ToRelativeTime(this DateTime from, DateTime to, bool usePreAndSuffix)
{
    string prefix = usePreAndSuffix && (from > to) ? "in " : string.Empty;
    string suffix = !usePreAndSuffix || (from > to) ? string.Empty : " ago";

    // is more than 1 year?
    if (from > to)
    {
        DateTime d = from;
        from = to;
        to = d;
    }

    int years = to.Year - from.Year;
    if ((to.Month < from.Month) || ((to.Month == from.Month) && (to.Day < from.Day)))
    {
        years--;
    }

    if (years > 1)
    {
        return string.Format("{0}{1} years{2}", prefix, years, suffix);
    }
    else if (years == 1)
    {
        return string.Format("{0}1 year{1}", prefix, suffix);
    }

    // less than 1 year, is more than 1 month?
    int months = to.Month - from.Month;
    if (months < 0)
    {
        months += 12;
    }

    if ((to.Day < from.Day) || ((to.Day == from.Day) && (to.TimeOfDay < from.TimeOfDay)))
    {
        months--;
    }

    if (months > 1)
    {
        return string.Format("{0}{1} months{2}", prefix, months, suffix);
    }
    else if (months == 1)
    {
        return string.Format("{0}1 month{1}", prefix, suffix);
    }

    // less than 1 month, is more than 1 day/week?
    TimeSpan diff = to - from;
    if (diff.Days > 7)
    {
        return string.Format("{0}{1} weeks{2}", prefix, diff.Days / 7, suffix);
    }
    else if (diff.Days > 1)
    {
        return string.Format("{0}{1} days{2}", prefix, diff.Days, suffix);
    }
    else if (diff.Days == 1)
    {
        return string.Format("{0}1 day{1}", prefix, suffix);
    }

    // less than 1 day, is more than 1 hour?
    if (diff.Hours > 1)
    {
        return string.Format("{0}{1} hours{2}", prefix, diff.Hours, suffix);
    }
    else if (diff.Hours == 1)
    {
        return string.Format("{0}1 hour{1}", prefix, suffix);
    }

    // less than 1 hour, is more than 1 minute?
    if (diff.Minutes > 1)
    {
        return string.Format("{0}{1} minutes{2}", prefix, diff.Minutes, suffix);
    }
    else if (diff.Minutes == 1)
    {
        return string.Format("{0}1 minute{1}", prefix, suffix);
    }

    // less than 1 minute
    if (diff.Seconds == 1)
    {
        return string.Format("{0}1 second{1}", prefix, suffix);
    }
    else if (diff.Seconds < 1)
    {

        return string.Format("{0}less than 1 second{1}", prefix, suffix);
    }

    return string.Format("{0}{1} seconds{2}", prefix, diff.Seconds, suffix);
}

This can of course be optimized for localization etc.


Temporary Stream

Scenario: you need to store a large block of data, e.g. as the result of an XSL transformation on an XML document. Using a MemoryStream would simply kill your server/application since it would use too much memory. Using a FileStream can be a but tedious since it would require write permissions on a specific folder…

Wait, doesn’t this sound just like a temporary file, i.e. storing a file in the TEMP path.

Yes, it does – and a simple solution is actually just to use a FileStream with a twist:

public class TempFileStream : FileStream 
{
    public TempFileStream() 
        : base(Path.GetTempFileName(), FileMode.OpenOrCreate, FileAccess.ReadWrite) 
    { 
    }

    public override void Close() 
    { 
        base.Close(); 
        if (File.Exists(Name)) 
        { 
            File.Delete(Name); 
        } 
    }
}

Here we simply create a new temporary file with R/W access. In the Close method of the FileStream we simply delete the file. Nice and simple and your temporary file only "lives" during your "using" statement…


Drag and Drop Control Extenders

After reading Jeff Prosise‘s MSDN magazine article (January 2008 edition) on Drag and Drop with ASP.NET AJAX (actually something he blogged about back in March 2007) I think the time has come to put my $0.02 on the issue. Actually it is not my $0.02 but merely a "formalization" of Jeff’s work.

I took his drag and drop implementation and created two control extenders, namely a Drag Source extender and a Drop Target extender. I added functionality to allow specifying the key/value of a drag object (i.e. which object you are actually dragging) and a key/value on the drop target (i.e. knowing where you drop the object, e.g. if a drop target is inside a repeater).

Usage is extremely simple. As always simply point the DragSourceExtender and/or DropTargetExtender to an ASP.NET Server Control (this is the "limitation", it must be a server side control), set the DragType, DropType, DragValue and DropValue as required and create a callback method in the OnClientDrop "event handler"/callback on the drop target.

The callback signature is:

/// <summary> 
/// Client-side drop event handler/callback method signature 
/// </summary> 
/// <param domelement="false" type="Veggerby.DropTargetBehavior" name="sender" /> 
/// The DOM element the drop is associated with 
/// </param> 
/// <param domelement="false" type="Veggerby.DropEventArgs" name="e" /> 
/// EventArgs for the drop operation, includes references to DragSource and DropTarget 
/// </param> 
function OnClientDrop(sender, e) 
{ 
}

Future enhancements could/would include allowing a service call on a successful drop, however currently this can be (easily) achieved manually in an OnClientDrop callback.

Download the source code here.


Sign-up and Login in One Step Membership Provider

Why has it got to be so hard? Why do you always have to go through a user creation wizard to create an account? Why just not create it as you login like they do on LibraryThing for example?

Well, there is of course always two sides to a coin. The obvious reason is: spam. However all that is needed is an username to "aggregate" your info, then this does not really matter.

So here is a very simple solution to this:

Create a custom MembershipProvider and in the ValidateUser() method first check if the user exists. If not then create the user and then validate him/her. There is of course the requirement that RequiresQuestionAndAnswer and RequiresUniqueEmail must be false.

One way of doing this is to refer a standard membership provider and add some logic to the ValidateUser():

public override bool ValidateUser(string username, string password)
{
    if (GetUser(username, false) == null)
    {
        MembershipCreateStatus status = MembershipCreateStatus.Success;
        MembershipUser user = CreateUser(username, password, null, null, null, true, null, out status);
        if (status != MembershipCreateStatus.Success)
        {
            throw new ProviderException(string.Format("Could not automatically create user: {0}", status));
        }
    }
    return MembershipProvider.ValidateUser(username, password);
}

Download the EasyRegisterMembershipProvider here.

To use this, download, compile and use it in Web.config:

<membership defaultProvider="SignUpProvider">
<providers>
  <clear/>
  <add name="SignUpMembershipProvider" type="Veggerby.Utility.EasySignUpMembershipProvider, Veggerby.Utility" providerName="SqlMembershipProvider"/>
  <add name="SqlMembershipProvider" …/>
</providers>
</membership>


Windows Live Writer Plugin for Pasting Source Code from Visual Studio

Having been through all the plugins available on Windows Live™ Gallery for showing syntax highlighted code snippets with Windows Live Writer, I gave up: there simply did/does not exist a plugin that 1) fulfills my needs and 2) displays properly on my blog.

I have tried Insert Code for Windows Live Writer, Paste from Visual Studio, Code Snippet plugin for Windows Live Writer and Insert Source Code Snippet. My favorite amongst those is definitely the Code Snippet plugin for Windows Live Writer. Many of them succeeds in meeting point #1, but they all without exception fail point #2.

What goes wrong for me is that I use the "Normal" in Live Writer for semi-WYSIWYG-ish interface. This however makes WLW reformat code, and all plugins does syntax highlighting using (amongst others) a <pre></pre> tag. This means that all white-space is significant. However WLW does not care about this, even though, it is within a <pre></pre> tag, so all line breaks and space for indentation is lost.

What to do???

Being the code geek I am, why not write my own WLW plugin that fulfills my needs/requirements:

Allow me to copy code from Visual Studio into WLW and keep formatting

And so be it, behold my first WLW plugin, it is sooooooo easy.

  1. Install the Windows Live Writer SDK (beta)
  2. Create a new class library in VS
  3. Add a reference to WindowsLive.Writer.Api.dll (default is C:\Program Files\Windows Live\Writer\)
  4. Create a class similar to the one below
  5. Build and copy .DLL to Windows Live Writer plugin folder (default is c:\Program Files\Windows Live Writer\Plugins\)
using System;
using System.Collections.Generic;
using System.Text;
using WindowsLive.Writer.Api;
using System.Windows.Forms;

namespace Veggerby.LiveWriter.CodeSnippetPlugin
{
    [WriterPlugin("a202a095-7d8b-4e10-8cb6-4fd51035d354", "Paste Code from Visual Studio",
        Description = "Paste Code from Visual Studio",
        HasEditableOptions = false,
        Name = "Paste Code from Visual Studio",
        PublisherUrl = "http://veggerby.com/livewriter/&quot;)]
    [InsertableContentSource("Paste Code from Visual Studio")]
    public class PasteCodePlugin : ContentSource
    {
        
        public override DialogResult CreateContent(IWin32Window dialogOwner, ref string newContent)
        {
            if (Clipboard.ContainsData(DataFormats.Rtf))
            {
                RtfToHtml converter = new RtfToHtml();
                converter.RtfDocument = Clipboard.GetData(DataFormats.Rtf) as string;
                newContent = string.Format("<div class=\"vscode\">{0}</div>", converter.ConvertToHtml());
                return DialogResult.OK;
            }
            return DialogResult.Cancel;
        }

    }
}

Where the tricky part lies in taking the code from the clipboard/Visual Studio, which is formatted in RTF and transform to HTML, i.e. the RtfToHtml class.

Syntax highlighting is achieved using <span></span> tags and the style="color: #ffffff" attribute, other formatting (font, etc) is done using CSS on the div.vscode class.

One problem remains still:

WLW will replace <br /><br /> (i.e. two consecutive <br /> tags) with a <p></p> tag. This is not as such a problem, but might require a little more CSS.

If you are interested in the complete source code, drop me a comment.


Follow

Get every new post delivered to your Inbox.