Adding "Sign-in with Yammer" to ASP.NET MVC apps

One of the biggest pain points with enterprise web ap­pli­ca­tions is user engagement stemming from another logon to remember, and mountain of profile fields to complete. For­tu­nate­ly there are ways to improve this experience.

with Yammer button.

Depending on the situation you might be able to take advantage of Integrated Windows Au­then­ti­ca­tion with access to Active Directory profiles, or have another identity service deployed. In my experience these can have a range of lim­i­ta­tions including poor data quality, and a heavy­weight pro­gram­ming model.

It would be nice to be able to implement something along the lines of Facebook Login. ASP.NET MVC 4.0 provides great support for social au­then­ti­ca­tion providers, but out of the box it doesn’t provide support for any enterprise social networks. These building blocks are, however, an excellent foundation for im­ple­ment­ing support for a Yammer provider.

Yammer is an enterprise social network (ESN) and at the core of the func­tion­al­i­ty is a user profile for each user within your or­ga­ni­za­tion. These profiles are controlled by users, and often have content that is more up-to-date than internal di­rec­to­ries. In many cases customers are also using Directory Sync to update profile fields. I took some time to implement an OAuth 2.0 client which is compatible with Yammer, and I'm sharing the details below. This can be used in ASP.NET MVC sites, but it is something that you could modify to work with other types of .NET ap­pli­ca­tions. There are however better choices for Windows Phone where an SDK is available.

Im­ple­ment­ing the client

As ASP.NET MVC builds on func­tion­al­i­ty from Dot­Ne­tOpe­nAuth the focus is on extending OAu­th2­Client as Yam­mer­Client. The complete im­ple­men­ta­tion is available online, but the methods you need to implement are:

  1. Get­Ser­viceL­ogin­Url() which is re­spon­si­ble for preparing the URL to redirect the user so that they can authorize your ap­­pli­­ca­­tion.
  2. Query­Ac­cessTo­ken() which executes a callback to Yammer in exchange for an OAuth access token.
  3. Ge­­tUser­­Da­­ta() which is re­spon­si­ble for querying profile data.

Something worth noting is that if you want to be able to make Yammer API calls, or silently check for profile updates, then you may need to modify Ge­tUser­Da­ta() to persist the token.

Using the client

Using the client in a new ASP.NET MVC Internet Ap­pli­ca­tion project is straight­for­ward. Before going any further there are some steps you need to take to register an ap­pli­ca­tion on the Yammer site. These steps can be completed through the registered ap­pli­ca­tions page, and detailed in­struc­tions are provided on the developer site. It is very important that you set a Redirect URI for your Yammer ap­pli­ca­tion. The format will be along the lines of http://localhost:31074/ for your de­vel­op­ment site in Visual Studio (adjust the port!), but you'll need to change it to something like for production.

Back in Visual Studio you simply need to in­stan­ti­ate an instance of the Yam­mer­Client class, and register it in AuthConfig.cs:

public static void RegisterAuth()
    const string appId = "Your Application ID";
    const string appSecret = "Your Application Secret";
    var client = new YammerClient(appId, appSecret);
    OAuthWebSecurity.RegisterClient(client, "Yammer", null);

When your ap­pli­ca­tion is launched it'll offer the ability to sign in with Yammer and any other OAuth au­then­ti­ca­tion clients that you have registered. It really is very slick!

A good next step is to modify your con­trollers and views to take advantage of the profile in­for­ma­tion beyond basic profile fields. That seems like good fodder for a future blog post.

Tagged with yammer, oauth, rest, authentication and security.