how to implement office 365 sso and google apps sso together for asp.net mvc5?

Question

We are trying to build an ASP.NET MVC 5 web application where two types of users can log in. We have some clients who use Google apps and others use Office 365. Here we already know which client use what service.

The way users login to our website should be as follows:

User sees a page where user has to select their company name from a drop-down.
Depending on company name the user choose, s/he should be redirected to that particular SSO login page.
After authentication, the user shall return to our website, and be considered as authenticated.

Depending on the service they use, we are also planning to leverage their apis, like Calender, Notes, etc.

I searched a lot but found nothing/irrelevant in this regard. Please help.

José F. Romaniello José F. Romaniello · Accepted Answer · 2014-04-01T12:07:53

If you want to implement this on your own, here are some tips from my experience:

Office365 (which is based on Windows Azure Active Directory): speaks a protocol called Ws-Federation with SAML tokens. To this moment, there are libraries for various platforms and languages.
Google Apps, is easier to Office365 since you have to use plain Google OAuth. One thing that might help you is that you can force the domain of Google Apps when doing the authentication by using the querystring parameter "hd" like "?hd=x.com". See this answer and the comments.

What you are trying to do it is not impossible but it requires some work and understanding all the protocols.

Another option is to use an authentication broker like Auth0. Your application sees auth0 as an OAuth provider and you can connect to your customers Google Apps and Office 365 from the dashboard or from an API which means that you can easily automate on-boarding customers. After you create the connection Auth0 will give you a link that you need to give to your customer so they can grant consent to your app to use their directory. From the client side perspective, you can achieve the combobox UI you describe by using auth0.js as follows:

var auth0 = new Auth0({
  //settings provide by auth0
});

var combo = $('#company-combo');

//loads the company combobox directly from auth0
auth0.getConnections(function (err, connections) {
  connections.forEach(function (c) {
    $('<option>')
      .attr('value', c.name)
      .text(c.name)
      .appendTo(combo);
  })
});

//trigger login
$('.login').on('click', function (e) {
  auth0.login({
    connection: $("option:selected", combo).val()
  })
});

Once the user logins, your application will get a profile. This profile has a property that indicates the connection/company.

Auth0 also provides an unified API to query/search users, in these two cases it uses the underlying directory but you get again the same profile representation.

Disclaimer: I work for Auth0.

how to implement office 365 sso and google apps sso together for asp.net mvc5?

2 Answers