OAuth2 in thinktecture IdentityServer v2: Implicit Grant Flow with JavaScript

Our thinktecture IdentityServer version 2 will be a very different and very powerful identity beast!

Dominick already talked quite a bit about the features and how to use them. And Brock is surely at it as well.

Today I will show how to use IdentityServerv2 to implement the OAuth2.0 implicit grant flow as outlined in the official OAuth2 spec – and we are going to use a JavaScript client for that.

For the sake of a little bit of mobile-ness I am going to use KendoUI Mobile to have a native looking mobile UI (which you could then combine e.g. with Cordova/PhoneGap to create a native app).

We are going to look to secure a super novel and world overtaking… TODO app Smile


Admittedly, this is only the basic gist of what an app should look like and feature-wise we will focus on the OAuth part today.
First let’s head to IdentityServer an create a new OAuth Client like this:


One important part of the configuration is the callback/redirect URI. This is where the IdP sends us the token to.

In addition, we need a relying party/resource we can use to create tokens for and which will accept these tokens coming from our JavaScript clients.


Alright, time to jump on to the client side.
I try to encapsulate my JS code as much as possible. One nice pattern to get a basic structure is MVVM and KendoUI has good support for that.

The page above for the Start tab has a viewmodel which does just fire up the OAuth process (in this case the authentication):

   1:  var startViewModel = kendo.observable({
   2:      openLoginView: function () {
   3:          oauth2ViewModel.openAuthWindow(
   4:             endpoints.IdpOauthEndpointUrl);
   5:      }
   6:  });

The OAuth viewmodel holds the token and offer methods to kick off the login process and parse the token from the return URL.

   1:  var oauth2ViewModel = kendo.observable({
   2:      token: "",
   4:      openAuthWindow: function () {
   5:          var url = endpoints.IdpOauthEndpointUrl + "?" 
   6:             + $.param(oAuthConfig);
   7:          window.open(url, "Login", "height=500,width=350");
   8:      },
  10:      loginCallback: function (params) {
  11:          this.token = params["access_token"];
  12:          window.kendoMobileApplication.navigate("#todosPage");
  13:      }
  14:  });

In order to craft the correct URL for IdentityServer we need a couple of parameters which need to correspond to what we previously set up in IdSrv for the OAuth client and the RP (see the IdSrv screenshots above):

   1:  var endpoints = {
   2:      IdpOauthEndpointUrl: "https://localhost/idsrv/issue/
   3:         oauth2/authorize"
   4:  };
   6:  var oAuthConfig = {
   7:      client_id: "tt_tudus",
   8:      scope: "http://tt.com/mobile/todos",
   9:      response_type: "token",
  10:      redirect_uri: "http://localhost/simpletudus/
  11:         oauthcallback.html"
  12:  }

Alright. Let’s look at the flow now.
Once we clicked on Login a new window pops up which loads the IdentityServer login page:


After loging into IdSrv we get the resource consent page and choose to allow access:


IdSrv will now send the token to callback URL specified earlier in the IdSrv config.

This URL looks something like this:


The code of the oauthcallback.html page is pretty simple. It parses the token from the hash (#) part of the URL and fires an event on the calling page to pass over the token (see the Google OAuth developers page for more details on the process):

   1:  <script src="js/libs/jquery-1.7.1.min.js" type="text/javascript"></script>
   2:  <script src="js/libs/jquery.ba-bbq.min.js" type="text/javascript"></script>
   4:  <script type="text/javascript">
   5:      //var params = {}, queryString = location.hash.substring(1),
   6:      //    regex = /([^&=]+)=([^&]*)/g, m;
   8:      //while (m = regex.exec(queryString)) {
   9:      //    params[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
  10:      //}
  12:      var params = $.deparam.fragment(
  13:         location.hash.substring(1));
  15:      window.opener.oAuthCallback(params);
  16:      window.close();    
  17:  </script>

: I am using jQuery BBQ in the above code to parse the URL, the commented code shows how to do it without any external library.

In the main page we have some kind of a proxy event handler which just passes the token on to the above shown OAuth viewmodel:

   1:  <script>
   2:      function oAuthCallback(params) {
   3:          oauth2ViewModel.loginCallback(params);
   4:      }
   5:  </script>

In the OAuth viewmodel login callback method we then simply set the token and trigger navigation to the TODO items page.

When hitting the refresh button in the upper left side of the Items view the actual call to the resource is made with standard jQuery. This happens in the loadTodos call:

   1:  var todosViewModel = kendo.observable({
   2:      todosSource: new kendo.data.DataSource(
   3:         { sort: { field: "title", dir: "asc" } }),
   5:      loadTodos: function () {
   6:          var self = this;
   8:          dataservices.getTodos(oauth2ViewModel.token)
   9:              .done(function (data) {
  10:                  self.todosSource.data(data);
  11:              });
  12:      }
  13:  });

The data services logic is embedded in its own ‘class’ and simply uses the token acquired before to set the appropriate Bearer Authorization header before making the jQuery GET request against the TODO items resource (which is implemented with ASP.NET Web API, BTW):…

   1:  var dataservices = (function () {
   2:      function beforeSend(xhr, token) {
   3:          xhr.setRequestHeader("Authorization", 
   4:             createBearerHeader(token));
   5:      }
   7:      function createBearerHeader(token) {
   8:          var header = "Bearer " + token;
   9:          return header;
  10:      }
  12:      return {
  13:          getTodos: function (token) {
  14:              return $.ajax({
  15:                  url: endpoints.ServiceEndpointUrl,
  16:                  type: "get",
  17:                  dataType: "json",
  18:                  beforeSend: function (xhr) { beforeSend(xhr, token); }
  19:              });
  20:          }
  21:      };
  22:  }());

And voila…:


So please head to GitHub and get the IdSrv bits and give us feedback – thanks!

The entire code for this complete end-to-end sample can be found on GitHub.

Hope this helps.

You thought identity management is ‘done’? Think twice: thinktecture IdentityServer v2 Beta is here

The Beta version of our open source IdentityServer STS has been released today:



Check out the short intro video to get a quick start:



Any feedback is always welcome and highly appreciated! Dominick and Brock (and a little bit of myself will hang out there…)



Bug in ASP.NET 4.0 routing: Web API Url.Link may return null

The other day I was building an integration layer for native HTML5/JS-based mobile apps with Windows Azure’s ACS. For that I needed to craft a redirect URL in one of the action in a controller called AcsController.

This is my route setup for Web API:

   1:  config.Routes.MapHttpRoute(
   2:      name: "ACSApi",
   3:      routeTemplate: "api/acs/{action}/{ns}",
   4:      defaults: new { controller = "Acs", ns = RouteParameter.Optional, 
   5:          realm = RouteParameter.Optional }
   6:  );
   8:  config.Routes.MapHttpRoute(
   9:      name: "DefaultApi",
  10:      routeTemplate: "api/{controller}/{id}",
  11:      defaults: new { id = RouteParameter.Optional }
  12:  );


Then in the controller action I try to use Url.Link to build a redirect URL:

var redirectUrl = Url.Link("ACSApi", new { controller = "Acs", action = "Noop" });

On various systems running .NET 4.0 this call returned null. Including Windows Azure Web Sites. On installations with .NET 4.5 all was fine. After several emails back and forth with the Web API team in Redmond it turned out that there is a bug in .NET 4.0.

The issue is in ASP.NET Routing with routes that have optional route values followed by a slash. This issue has been fixed in .NET 4.5. But there is a workaround for 4.0 like this:

   1:  config.Routes.MapHttpRoute(
   2:      name: "ACSApi",
   3:      routeTemplate: "api/acs/{action}/{ns}",
   4:      defaults: new { controller = "Acs", ns = RouteParameter.Optional, 
   5:          realm = RouteParameter.Optional }
   6:  );
   8:  config.Routes.MapHttpRoute(
   9:      name: "ACSApi2",
  10:      routeTemplate: "api/acs/{action}/{ns}/{realm}",
  11:      defaults: new { controller = "Acs", realm = RouteParameter.Optional }
  12:  );
  14:  config.Routes.MapHttpRoute(
  15:      name: "DefaultApi",
  16:      routeTemplate: "api/{controller}/{id}",
  17:      defaults: new { id = RouteParameter.Optional }
  18:  );


Hope this helps.

Unterlagen & Demos von der BASTA! 2012

Wie in meinen Vorträgen, in der Keynote und im Panel versprochen, hier nun die Slides und Demos zu meinen Auftritten auf der BASAT! 2012.

  • Für jedermann: Leichtgewichtige Services-Architekturen mit Web-APIs
  • Leicht gemacht: Push-Kommunikation mit SignalR
  • Messaging mit .NET für jedermann – in der Cloud und lokal: Windows [Azure | Server] Service Bus
  • Mobile und Cloud: Apps und Devices mit, in und über Windows Azure verbinden


Vielen Dank an alle, die in den Vorträgen waren – und Danke an die Organisatoren der BASTA!

Federating Windows Azure Service Bus & Access Control Service with a custom STS: thinktecture IdentityServer helps with more real-world-ish Relay and Brokered Messaging

The Windows Azure Service Bus and the Access Control Service (ACS) are good friends – buddies, indeed.

Almost all official Windows Azure Service Bus-related demos use a shared secret approach to authenticate directly against ACS (although it actually is not an identity provider), get back a token and then send that token over to the Service Bus. This magic usually happens all under the covers when using the WCF bindings.

All in all, this is not really what we need and seek for in real projects.
We need the ability to have users or groups (or: identities with certain claims) authenticate against identity providers that are already in place. This IdP needs to be federated with the Access Control Service which then in turn spits out a token the Service Bus can understand.

Wouldn’t it be nice to authenticate via username/password (for real end users) or via certificates (for server/services entities)?

Let’s see how we can get this working by using our thinktecture IdentityServer. For the purpose of this blog post I am using our demo IdSrv instance at https://identity.thinktecture.com/idsrv.

The first thing to do is to register IdSrv as an identity provider for the respective Service Bus ACS namespace. Each SB namespace has a so called buddy namespace in ACS. The buddy namespace for christianweyer is christianweyer-sb. You can get to it by clicking the Access Control Service button in the Service Bus portal like here:


In the ACS portal for the SB buddy namespace we can then add a new identity provider.



thinktecture IdentityServer does support various endpoints and protocols, but for this scenario we are going to add IdSrv as a WS-Federation-compliant IdP to ACS. At the end we will be requesting SAML token from IdSrv.


The easiest way to add it to ACS is to use the service metadata from https://identity.thinktecture.com/idsrv/FederationMetadata/2007-06/FederationMetadata.xml

Note: Make sure that the checkbox is ticked for the ServiceBus relying party at the bottom of the page.


Next, we need to add new claims rules for the new IdP.

Let’s create a new rule group.


I am calling the new group IdSrv SB users. In that group I want to add at least one rule which says that a user called Bob is allowed to open endpoints on my Service Bus namespace.


In order to make our goal, we say that when an incoming claim of (standard) type name contains a value Bob then we are going to emit a new claim of type net.windows.servicebus.action with the Listen value. This is the claim the Service Bus can understand.
Simple and powerful.


We could now just add a couple more rules here for other users or even X.509 client certificates.

Before we can leave the ACS configuration alone we need to enable the newly created rule group on the ServiceBus relying party:


… and last but not least I have to add a new relying party configuration in Identity Server for my SB buddy namespace with its related WRAP endpoint:



For using the external IdP in my WCF-based Service Bus applications I wrote a very small and simpler helper class with extension methods for the TransportClientEndpointBehavior. It connects to the STS/IdP requesting a SAML token which is then used as the credential for the Service Bus.


using System;
using System.IdentityModel.Tokens;
using System.Security.Cryptography.X509Certificates;
using System.ServiceModel;
using System.ServiceModel.Security;
using Microsoft.IdentityModel.Protocols.WSTrust;
using Microsoft.IdentityModel.Protocols.WSTrust.Bindings;
using Microsoft.ServiceBus;

namespace ServiceBus.Authentication
    public static class TransportClientEndpointBehaviorExtensions
        public static string GetSamlTokenForUsername(
           this TransportClientEndpointBehavior behavior, string issuerUrl, string serviceNamespace, 
           string username, string password)
            var trustChannelFactory =
                new WSTrustChannelFactory(
                    new UserNameWSTrustBinding(SecurityMode.TransportWithMessageCredential),
                    new EndpointAddress(new Uri(issuerUrl)));

            trustChannelFactory.TrustVersion = TrustVersion.WSTrust13;
            trustChannelFactory.Credentials.UserName.UserName = username;
            trustChannelFactory.Credentials.UserName.Password = password;

                var tokenString = RequestToken(serviceNamespace, trustChannelFactory);

                return tokenString;
            catch (Exception ex)

        public static string GetSamlTokenForCertificate(
           this TransportClientEndpointBehavior behavior, string issuerUrl, string serviceNamespace, 
           string certificateThumbprint)
            var trustChannelFactory =
                new WSTrustChannelFactory(
                    new CertificateWSTrustBinding(SecurityMode.TransportWithMessageCredential),
                    new EndpointAddress(new Uri(issuerUrl)));

            trustChannelFactory.TrustVersion = TrustVersion.WSTrust13;

                var tokenString = RequestToken(serviceNamespace, trustChannelFactory);

                return tokenString;
            catch (Exception ex)

        private static string RequestToken(string serviceNamespace, WSTrustChannelFactory trustChannelFactory)
            var rst =
                new RequestSecurityToken(WSTrust13Constants.RequestTypes.Issue, 
            rst.AppliesTo = new EndpointAddress(
                String.Format("https://{0}-sb.accesscontrol.windows.net/WRAPv0.9/", serviceNamespace));
            rst.TokenType = Microsoft.IdentityModel.Tokens.SecurityTokenTypes.Saml2TokenProfile11;

            var channel = (WSTrustChannel)trustChannelFactory.CreateChannel();
            var token = channel.Issue(rst) as GenericXmlSecurityToken;
            var tokenString = token.TokenXml.OuterXml;

            return tokenString;


Following is a sample usage of the above class.

static void Main(string[] args)
    var serviceNamespace = "christianweyer";
    var usernameIssuerUrl = 

    var host = new ServiceHost(typeof(EchoService));

    var a = ServiceBusEnvironment.CreateServiceUri(
        "https", serviceNamespace, "echo");
    var b = new WebHttpRelayBinding();
    b.Security.RelayClientAuthenticationType =
        RelayClientAuthenticationType.None; // for demo only!
    var c = typeof(IEchoService);

    var authN = new TransportClientEndpointBehavior(); 
    var samlToken = authN.GetSamlTokenForUsername(
        usernameIssuerUrl, serviceNamespace, "bob", ".......");
    authN.TokenProvider =

    var ep = host.AddServiceEndpoint(c, b, a);
    ep.Behaviors.Add(new WebHttpBehavior());

    Console.WriteLine("Service running...");

        .ForEach(enp => Console.WriteLine(enp.Address));



And the running service in action (super spectacular!)


Hope this helps!

ASP.NET Web API changes from Beta to RC

The official word on changes from Beta to RC for Web API-related topics (filtered from the original page).

  • ASP.NET Web API now uses Json.NET for JSON formatting: The default JSON formatter in ASP.NET Web API now uses Json.NET for JSON serialization. Json.NET provides the flexibility and performance required for a modern web framework.
  • Formatter improvements: The methods on MediaTypeFormatter are now public to enable unit testing of custom formatters. A single formatter can now support multiple text encodings. UseBufferedMediaTypeFormatter to implement simple synchronous formatting support.FormatterContext has been removed. To get access to the request from a formatter on the server implement GetPerRequestFormatterInstance.
  • Removed System.Json.dll: Because of the overlap with functionality already in Json.NET the System.Json.dll assembly has been removed.
  • XmlMediaTypeFormatter uses DataContractSerializer by default: The XmlMediaTypeFormatternow uses the DataContractSerializer by default. This means that by default ASP.NET Web API will use the Data Contract programming model for formatting types. You can configure theXmlMediaTypeFormatter to use the XmlSerializer by setting UseXmlSerializer to true.
  • Formatters now always handle the body content: ASP.NET Web API formatters are now used consistently for handling both the request and response content. We have removedIRequestContentReadPolicy. The FormUrlEncodedMediaTypeFormatter class has been updated to use MVC-style model binding, so you can still use model binding infrastructure for handling form data in the request body.
  • HTTP content negotiation decoupled from ObjectContent: Previously in ASP.NET Web API all HTTP content negotiation logic was encapsulated in ObjectContent, which made it difficult to predict when HTTP content negotiation would occur. We have decoupled HTTP content negotiation from ObjectContent and encapsulated it as an IContentNegotiator implementation.ObjectContent now takes a single formatter. You can run HTTP content negotiation whenever you want using the DefaultContentNegotiator implementation to select an appropriate formatter.IFormatterSelector has been removed
  • Removed HttpRequestMessage<T> and HttpResponseMessage<T>: Previously there were two ways to specify a request or response with an ObjectContent instance: you could provide anObjectContent instance directly, or you could use HttpRequestMessage<T> orHttpResponseMessage<T>. Having two ways of doing the same thing complicated request and response handling, so HttpRequestMessage<T> and HttpResponseMessage<T> have been removed. To create content negotiated responses that contain an ObjectContent use the CreateResponse<T>extension methods on the request message. To send a request that contains an ObjectContent use the PostAsync<T> extension methods on HttpClient. Or, use the PostAsJsonAsync<T> andPostAsXmlAsync<T> extension methods to specify a request that will be specifically formatted with as JSON or XML respectively.
  • Simplified action parameter binding: You can now predictably determine whether an action parameter will be bound to the request body. This ensures that the request stream is not unnecessarily consumed. Parameters with simple types by default come from the URL. Parameters with complex types by default come from the body. There can be only one body parameter. You can explicitly specify if a parameter comes from the URL or from the body using the [FromUri] and[FromBody] attributes.
  • Query composition is now implemented as a reusable filter: Previously support for query composition was hard coded into the runtime. Query composition is now implemented as a reusable filter that can be applied as an attribute ([Queryable]) to any action that returns anIQueryable instance. This attribute is now required to enable query composition.
  • Cookies: The HttpRequestMessage and HttpResponseMessage classes expose the HTTP Cookie and Set-Cookie headers as raw strings and not structured classes. This made it cumbersome and error prone to work with cookies in ASP.NET Web API. To fix this we introduced two newCookieHeaderValue and CookieState that follow RFC 6265 HTTP State Management Mechanism. You can use the AddCookies extension method to add a Set-Cookie header to a response message. Use the GetCookies extension method to get all of the CookieHeaderValues from a request.
  • HttpMessageInvoker: The HttpMessageInvoker provides a light weight mechanism to invoke anHttpMessageHandler without the overhead of using HttpClient. Use HttpMessageInvoker for unit testing message handlers and also for invoking message handlers on the server.
  • Response buffering improvements: When web-hosting a web API the response content length is now set intelligently so that responses are not always chunked. Buffering also enables reasonable error messages to be returned when exceptions occur in formatters.
  • Independently control IHttpController selection and activation: Implement theIHttpControllerSelector to control IHttpController selection. Implement IHttpControllerActivator to control IHttpController activation. The IHttpControllerFactory abstraction has been removed.
  • Clearer integration with IoC containers that support scopes: The dependency resolver for ASP.NET Web API now supports creating dependency scopes that can be independently disposed. A dependency scope is created for each request and is used for controller activation. Configuring dependency resolution (i.e. HttpConfiguration.DependencyResolver) is optional and is now configured separately from the default services used by ASP.NET Web API (HttpConfiguration.Services). However, the service locator consults the dependency resolver first for required services and then falls back to explicitly configured services.
  • Improved link generation: The ASP.NET Web API UrlHelper how has convenience methods for generating links based on the configured routes and the request URI.
  • Register resource for disposal at the end of the request life-time: Use the RegisterForDisposeextension method on the request to register an IDisposable instance that should be disposed when the request is disposed.
  • Monitoring and diagnostics: You can enable tracing by providing an ITraceWriterimplementation and configuring it as a service using the dependency resolver. The ILoggerinterface has been removed.
  • Create custom help and test pages: You now can easily build custom help and test pages for your web APIs by using the new IApiExplorer service to get a complete runtime description of your web APIs.
  • Entity Framework based scaffolding for web APIs: Use the Add Controller dialog to quickly scaffold a web API controller based on an Entity Framework based model type.
  • Create unit test projects for Web API projects: You can now easily create a unit test project for a Web API project using the New ASP.NET MVC 4 Project dialog box.
  • Unauthorized requests handled by ASP.NET Web API return 401 Unauthroized: Unauthorized requests handled by ASP.NET Web API now return a standard 401 Unauthorized response instead of redirecting the user agent to a login form so that the response can be handled by an Ajax client.
  • Configuration logic for MVC applications moved under the App_Start directory: The configuration logic For MVC applications has been moved from Global.asax.cs to a set of static classes in the App_Start directory. Routes are registered in RouteConfig.cs. Global MVC filters are registered in FilterConfig.cs. Bundling and minification configuration now lives in BundleConfig.cs.
  • Add Controller to any project folder: You can now right click and select Add Controller from any folder in your MVC project. This gives you more flexibility to organize your controllers however you want, including keeping your MVC and Web API controllers in separate folders.


Measuring performance of your HTTP-based .NET applications: Performance Counters for HttpWebRequest

Just found this and thought to share it with you: Network Class Library Team (System.Net): New Performance Counters for HttpWebRequest


Each of the seven green circles represents one of the six performance counters (there are two ‘5’ items because 5 is the average lifetime, and there are two code paths that will affect that counter).


Note: Be aware that ‘new’ means new in .NET 4.0 (the blog post is from Aug 2009).

Slides for my sessions at DevWeek 2012

And here we go – as promised to all of you nice people attending one of my sessions last week in London.


If you have questions, please feel free to send my an email!

See you next year at DevWeek.