showing a cordova office365 login on an Android/KindleFire device


http://channel9.msdn.com/Events/TechEd/NorthAmerica/2014/DEV-B323#fbid= gives us some background on how to make an app for devices that can do office365 login.

our code is at https://onedrive.live.com/redir?resid=5061D4609325B60!8475&authkey=!AHJ0OsWngL-D0tM&ithint=file%2c.zip

It us some hints on how to take a baseline cordova blank application and add the ADAL toolkit – javascript version. We can ignore most of the example given in the video, which applies some particular MVC library. Our goal is simply to invoke ADAL on windows phone and then android!

From a couple of video frames, we see the load order of libraries, from below:

image

giving us our own index.html file as shown (having created a typescript blank cordova application).

image

with code

<!DOCTYPE html>
<html>
<head>
    <meta charset=”utf-8″ />
    <title>BlankCordovaApp2</title>

    <!– Cordova reference, this is added to your app when it’s built. –>
    <script src=”cordova.js”></script>

    <script src=”InAppBrowserOverride.js”></script>
    <script src=”scripts/utility.js”></script>
    <script src=”scripts/aadgraph.js”></script>
    <script src=”scripts/o365adal.js”></script>
    <script src=”scripts/exchange.js”></script>
    <script src=”services/office365/settings.js”></script>

    <!– BlankCordovaApp2 references –>
    <link href=”css/index.css” rel=”stylesheet” />
</head>
<body>
    <p>Hello, your application is ready!</p>

    <script src=”scripts/index.js”></script>

</body>
</html>

 

and from the following we also see how to invoke the O365 Auth object:

image

Here, the only thing that seems interesting is the

authContext = new 365Auth.Context()

 

From http://blogs.office.com/2014/05/12/net-and-javascript-libraries-for-office-365-apis/ we get some ideas:

var authContext = new O365Auth.Context();
authContext.getIdToken(‘https://outlook.office365.com/&#8217;)
.then((function (token) {
// authentication succeeded
var client = new Exchange.Client(‘https://outlook.office365.com/ews/odata&#8217;,
token.getAccessTokenFn(‘https://outlook.office365.com&#8217;));
client.me.calendar.events.getEvents().fetch()
.then(function (events) {
// get currentPage of calendar events
var myevents = events.currentPage;
}, function (reason) {
// handle error
});
}).bind(this), function (reason) {
// authentication failed
});

When we put that bit of code after initialization

 

window.onload = function () {
        Application.initialize();

        var authContext = new O365Auth.Context();
        authContext.getIdToken(‘https://outlook.office365.com/’)
            .then((function (token) {
                // authentication succeeded
                var client = new Exchange.Client(‘https://outlook.office365.com/ews/odata’,
                    token.getAccessTokenFn(‘https://outlook.office365.com’));
                client.me.calendar.events.getEvents().fetch()
                    .then(function (events) {
                        // get currentPage of calendar events
                        var myevents = events.currentPage;
                    }, function (reason) {
                        // handle error
                    });
            }).bind(this), function (reason) {
                // authentication failed
            });

    }

we get what is shows in the video – once the app is downloaded to my kindle device:

 

my first ADAL screen on kindle–vectoring to pinpad login
Advertisements

About home_pw@msn.com

Computer Programmer who often does network administration with focus on security servers. Very strong in Microsoft Azure cloud!
This entry was posted in AAD, Azure AD. Bookmark the permalink.