Any examples of Oauth2 & Windows/Microsoft login?


#1

HI, trying to see if I could use something like https://atmospherejs.com/meteor/oauth2 to allow a user with a hotmail.com or live.com to login to Meteor.

Anyone have any examples and/or packages that you could recommend, pls?


#2

Try Meteor itself for examples: https://github.com/meteor/meteor/tree/devel/packages

Each service uses 2 packages: 1 for the api and 1 for the account.

For example, the twitter and accounts-twitter.


#3

AzureAd This will let your users log in to your app using Azure Active Directory. I have tried it and it works. All the instruction to setup up your active directory and integerate with meteor are there in that repo. Have fun


#4

@areich @Murwade thanks folks… ok going to look into this


#5

@Murwade @areich thanks again… trying to hack together a working example first and then may publish as a package.

I am just bumping around in the dark trying to back track on the twitter/facebook/azure packages and trying to understand how this applies to the Microsoft API.

I currently can call my and managed to get the Microsoft Live to come up… but there’s a few missing bits for me.

So I have the following Gist:
https://gist.github.com/adamgins/2233ffa81b66a34d99ff

If I hardcode Line 37 (replace line 36) https://gist.github.com/adamgins/2233ffa81b66a34d99ff#file-microsoft-oauth_microsoft_client-js-L37

It pops up the Microsoft window and allows me to login. Obviously this is the wrong redirect_url , so it won’t take me back to my Meteor app. If I go with the current version I can’t seem to get the redirect to work and I am not clear what it should be. That said, it is picking it up with what I have defined into the Microsoft app at https://account.live.com/developers/applications

I set this to https://localhost/_oauth/microsoft but then I get an invalid redirect URL… so not sure how I tie this in the Meteor oauth stuff or how I setup Meteor Oauth to accept this URL???

UPdate: I think I have “kinda” resolved this. I needed to use an external domain, could not get it to accept “localhost”. ANyway, It does not see to pop up the window but redirects to a page that says “Login completed. Click here to close this window.” THere is a warning in the browser console: “Scripts may close only the windows that were opened by it.” and on the server console:
W20150406-16:12:06.893(10) (oauth_server.js:71) Unable to base64 decode state from OAuth query: undefined W20150406-16:12:06.893(10) (oauth_server.js:71) Unable to base64 decode state from OAuth query: undefined W20150406-16:12:06.894(10) (oauth_server.js:71) Unable to base64 decode state from OAuth query: undefined W20150406-16:12:06.894(10) (oauth_server.js:398) Error in OAuth Server: Match error: Expected string, got undefined

My second big question is I have not idea what the server urls/settings are for Microsoft? I copied the twitter stuff from the Meteor packages but I have no idea what the "url"s to Microsoft should be including the oauthBinding.get('https://api.twitter.com/1.1/account/verify_credentials.json').data;

Update a changed that parameter to “null”… but no luck. My line 20 in the microsoft_server.js:

OAuth.registerService('microsoft', 1, null, function(oauthBinding)

Any help appreciated.

@khamoud how goes? I noticed your name on the Stripe example, not sure if you have some guidance, pls?


#6

Have you tried setting up another oAuth service just to get a feel for how it works? Twitter seems the easiest. Also, have you set the new Microsoft services up? Something like the following in a .js file in your app’s server folder:

ServiceConfiguration.configurations.remove({
    service: "Microsoft"
});

ServiceConfiguration.configurations.upsert(
    { service: "Microsoft" },
    {
        $set: {
            rootUrl: "http://www.live.com",
            secret: "FOO", //supplied by Microsoft
            loginStyle: "redirect"
        }
    }
);

How to create a new OAuth provider for authentication?
#7

Microsoft won’t allow an app with localhost. Do the best you can locally and setup an app with a meteor account to test it.


#8

@areich thanks. Yep, have it working for Facebook, Google etc. Sorry I should have included that bit in the Gist.

I think my config setting are wrong, based on your example, I was using:

ServiceConfiguration.configurations.remove({
    service: "microsoft"
});

ServiceConfiguration.configurations.insert({
    service: "microsoft",
    clientId: "<clientid>",
    secret: "<secret>",
    loginStyle: "redirect",
    display: "popup",
    scope:"wl.signin"

}); 

So will give it a try a bit later. Thanks.


#9

@khamoud @jkatzen thanks heaps for your time today.

I made some progress and worked added another HTTP request to get the user info/emails with:

var responseData = HTTP.get(
       "https://apis.live.net/v5.0/me", {
        params: {
            access_token: parsedResponse.access_token,
        }
      }).data;

I had to add the scope wl.emails to the client request. So my scope is currently '“wl.signin wl.basic wl.emails”`

Anyway, I have it grabbling the user data… after a bit of fiddling around, I worked out I needed to set the ‘email:’ property in the serviceData and presto my user is created after authenticating with Microsoft.

thanks again for the help.

I’ll need to clean up and remove all the hard coded stuff and hopefully publish so folks can review (or bash me up) my code. :wink:


#10

Great! I’m glad it worked. Sorry I had to leave before we could figure it out on the hangout.


#11

@khamoud no worries, thanks again for the help. Will try and cleanup and and get on Github so you can tear in mistakes I made to shreds :wink:


#12

@khamoud , I created this Gist… I should have actually uploaded to github… will do that now https://gist.github.com/anonymous/357852f8770155341a6a
Here’s git repository: https://github.com/Buzzy-Buzz/microsoft-oauth