Skip to content
This repository has been archived by the owner. It is now read-only.

Prkanher/ie login redirect #5

Merged
merged 10 commits into from
Sep 19, 2018
Merged

Prkanher/ie login redirect #5

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
2f88dc2
Adding browser detection functionality
Sep 18, 2018
f0c7ea0
Refactored browser detection to be more concise, reflect patterns better
Sep 18, 2018
4308d99
deleting test client id, adding storeAuthStateInCookie (added in prev…
Sep 18, 2018
d680af4
Cleaning code
Sep 18, 2018
031ada2
Refactored to separate functionality
Sep 18, 2018
1fbe10f
Remove hardcoded client ID from sample.
navyasric Sep 19, 2018
bbb6a2f
Fixes for onload issues in IE, adding postlogout to app json
Sep 19, 2018
8c34b58
Merge branch 'prkanher/IELoginRedirect' of https://github.com/Azure-S…
Sep 19, 2018
ec31bca
Removing errors after merge
Sep 19, 2018
e3faedb
Removing the index_login_redirect file
navyasric Sep 19, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions AppCreationScripts/apps.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
"x-ms-id": "JavaScriptSpa",
"x-ms-name": "active-directory-javascript-graphapi-v2",
"x-ms-version": "2.0",
"logoutUrl": "http://localhost:30662/",
"replyUrlsWithType": [
{
"url": "http://localhost:30662/",
Expand Down
184 changes: 112 additions & 72 deletions JavaScriptSPA/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,96 +2,136 @@
<html>
<head>
<title>Quickstart for MSAL JS</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js"></script>
<script src="https://secure.aadcdn.microsoftonline-p.com/lib/0.2.3/js/msal.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" class="pre"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js" class="pre"></script>
<style>
table, td, th {
border: 1px solid black;
}
</style>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
</head>

<body>
<h2>Welcome to MSAL.js Quickstart</h2><br/>
<h4 id="WelcomeMessage"></h4>
<button id="SignIn" onclick="signIn()">Sign In</button><br/><br/>
<table id="graphData"></table>
<h4 id="WelcomeMessage"></h4>
<button id="SignIn" onclick="signIn()">Sign In</button>
<br/><br/>
<pre id="json"></pre>

<script>
var applicationConfig = {
clientID: "Enter_the_Application_Id_here", //This is your client ID
graphScopes: ["user.read"],
graphEndpoint: "https://graph.microsoft.com/v1.0/me"
};
<script>
var applicationConfig = {
clientID: '0813e1d1-ad72-46a9-8665-399bba48c201', //This is your client ID
graphScopes: ["user.read"],
graphEndpoint: "https://graph.microsoft.com/v1.0/me"
};

//Pass null for default authority (https://login.microsoftonline.com/common) and tokenReceivedCallback if using popup apis
var myMSALObj = new Msal.UserAgentApplication(applicationConfig.clientID, null, null);
//Pass null for default authority (https://login.microsoftonline.com/common)
var myMSALObj = new Msal.UserAgentApplication(applicationConfig.clientID, null, acquireTokenRedirectCallBack,
{storeAuthStateInCookie: true, cacheLocation: "localStorage"});

function signIn() {
myMSALObj.loginPopup(applicationConfig.graphScopes).then(function (idToken) {
//Login Success
showWelcomeMessage();
acquireTokenAndCallMSGraph();
}, function (error) {
console.log(error);
});
}
function signIn() {
myMSALObj.loginPopup(applicationConfig.graphScopes).then(function (idToken) {
//Login Success
showWelcomeMessage();
acquireTokenPopupAndCallMSGraph();
}, function (error) {
console.log(error);
});
}

function signOut() {
myMSALObj.logout();
}
function signOut() {
myMSALObj.logout();
}

function acquireTokenPopupAndCallMSGraph() {
//Call acquireTokenSilent (iframe) to obtain a token for Microsoft Graph
myMSALObj.acquireTokenSilent(applicationConfig.graphScopes).then(function (accessToken) {
callMSGraph(applicationConfig.graphEndpoint, accessToken, graphAPICallback);
}, function (error) {
console.log(error);
// Call acquireTokenPopup (popup window) in case of acquireTokenSilent failure due to consent or interaction required ONLY
if (error.indexOf("consent_required") !== -1 || error.indexOf("interaction_required") !== -1 || error.indexOf("login_required") !== -1) {
myMSALObj.acquireTokenPopup(applicationConfig.graphScopes).then(function (accessToken) {
callMSGraph(applicationConfig.graphEndpoint, accessToken, graphAPICallback);
}, function (error) {
console.log(error);
});
}
});
}

function acquireTokenAndCallMSGraph() {
//Call acquireTokenSilent (hidden iframe) to obtain a token for Microsoft Graph
myMSALObj.acquireTokenSilent(applicationConfig.graphScopes).then(function (accessToken) {
callMSGraph(applicationConfig.graphEndpoint, accessToken, graphAPICallback);
}, function (error) {
//Call acquireTokenPopup (popup window) in case of acquireToken Failure
if (error.indexOf("consent_required") !== -1 || error.indexOf("interaction_required") !== -1) {
myMSALObj.acquireTokenPopup(applicationConfig.graphScopes).then(function (accessToken) {
callMSGraph(applicationConfig.graphEndpoint, accessToken, graphAPICallback);
}, function (error) {
});
}
});
function callMSGraph(theUrl, accessToken, callback) {
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200)
callback(JSON.parse(this.responseText));
}
xmlHttp.open("GET", theUrl, true); // true for asynchronous
xmlHttp.setRequestHeader('Authorization', 'Bearer ' + accessToken);
xmlHttp.send();
}

function graphAPICallback(data) {
//Display user data on DOM
var divWelcome = document.getElementById('WelcomeMessage');
divWelcome.innerHTML += " to Microsoft Graph API!!";
document.getElementById("json").innerHTML = JSON.stringify(data, null, 2);
}

function callMSGraph(theUrl, accessToken, callback) {
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200)
callback(JSON.parse(this.responseText));
function showWelcomeMessage() {
var divWelcome = document.getElementById('WelcomeMessage');
divWelcome.innerHTML += 'Welcome ' + myMSALObj.getUser().name;
var loginbutton = document.getElementById('SignIn');
loginbutton.innerHTML = 'Sign Out';
loginbutton.setAttribute('onclick', 'signOut();');
}

// This function can be removed if you do not need to support IE
function acquireTokenRedirectAndCallMSGraph() {
//Call acquireTokenSilent (iframe) to obtain a token for Microsoft Graph
myMSALObj.acquireTokenSilent(applicationConfig.graphScopes).then(function (accessToken) {
callMSGraph(applicationConfig.graphEndpoint, accessToken, graphAPICallback);
}, function (error) {
console.log(error);
//Call acquireTokenRedirect in case of acquireToken Failure
if (error.indexOf("consent_required") !== -1 || error.indexOf("interaction_required") !== -1 || error.indexOf("login_required") !== -1) {
myMSALObj.acquireTokenRedirect(applicationConfig.graphScopes);
}
xmlHttp.open("GET", theUrl, true); // true for asynchronous
xmlHttp.setRequestHeader('Authorization', 'Bearer ' + accessToken);
xmlHttp.send();
}
});
}

function graphAPICallback(data) {
//Display user data on DOM
var divWelcome = document.getElementById('WelcomeMessage');
divWelcome.innerHTML += " to Microsoft Graph API!!";
$.each(data, function (key, value) {
var tr = $('<tr></tr>');
$('<td>' + '<i>' + key + '</i>' + '</td>').appendTo(tr);
$('<td>' + value + '</td>').appendTo(tr);
tr.appendTo('#graphData');
});
}
function acquireTokenRedirectCallBack(errorDesc, token, error, tokenType)
{
if(tokenType === "access_token")
{
callMSGraph(applicationConfig.graphEndpoint, accessToken, graphAPICallback);
} else {
console.log("token type is:"+tokenType);
}

}

function showWelcomeMessage() {
var divWelcome = document.getElementById('WelcomeMessage');
divWelcome.innerHTML += 'Welcome ' + myMSALObj.getUser().name;
var loginbutton = document.getElementById('SignIn');
loginbutton.innerHTML = 'Sign Out';
loginbutton.setAttribute('onclick', 'signOut();');
// Browser check variables
var ua = window.navigator.userAgent;
var msie = ua.indexOf('MSIE ');
var msie11 = ua.indexOf('Trident/');
var msedge = ua.indexOf('Edge/');
var isIE = msie > 0 || msie11 > 0;
var isEdge = msedge > 0;

//If you support IE, our recommendation is that you sign-in using Redirect APIs
//If you as a developer are testing using Edge InPrivate mode, please add "isEdge" to the if check
if (!isIE) {
if (myMSALObj.getUser()) {// avoid duplicate code execution on page load in case of iframe and popup window.
showWelcomeMessage();
acquireTokenPopupAndCallMSGraph();
}
}
else {
document.getElementById("SignIn").onclick = function () {
myMSALObj.loginRedirect(applicationConfig.graphScopes);
};

if (myMSALObj.getUser() && !myMSALObj.isCallback(window.location.hash)) {// avoid duplicate code execution on page load in case of iframe and popup window.
showWelcomeMessage();
acquireTokenAndCallMSGraph();
acquireTokenRedirectAndCallMSGraph();
}
</script>
}
</script>
</body>
</html>
101 changes: 0 additions & 101 deletions JavaScriptSPA/index_login_redirect.html
View file
Open in desktop

This file was deleted.