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

Commit 20fa569

Browse files
DarylThayilDarylThayil
committed
add login type
1 parent c933c29 commit 20fa569

File tree

4 files changed

+73
-74
lines changed

4 files changed

+73
-74
lines changed

‎JavaScriptSPA/index.html‎

Lines changed: 55 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
<title>Quickstart for MSAL JS</title>
55
<script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js"></script>
6-
<script src="/msal-0.9.0.min.js"></script>
6+
<script src="/msal-1.0.0-preview.min.js"></script>
77
<link rel="stylesheet" type="text/css" href="/style.css">
88
</head>
99

@@ -18,33 +18,48 @@
1818
</div>
1919
</div>
2020
<script>
21-
var applicationConfig = {
22-
clientID: "245e9392-c666-4d51-8f8a-bfd9e55b2456",
23-
authority: "https://login.microsoftonline.com/common",
24-
graphScopes: ["user.read", "Mail.Send"],
25-
graphEndpoint: "https://graph.microsoft.com/v1.0/me"
26-
};
2721

28-
var config = {
22+
// Browser check variables
23+
var ua = window.navigator.userAgent;
24+
var msie = ua.indexOf('MSIE ');
25+
var msie11 = ua.indexOf('Trident/');
26+
var msedge = ua.indexOf('Edge/');
27+
var isIE = msie > 0 || msie11 > 0;
28+
var isEdge = msedge > 0;
29+
//If you support IE, our recommendation is that you sign-in using Redirect APIs
30+
//If you as a developer are testing using Edge InPrivate mode, please add "isEdge" to the if check
31+
32+
// can change this to default an experience outside browser use
33+
var loginType = isIE ? "REDIRECT" : "POPUP";
34+
35+
var msalConfig = {
2936
auth: {
30-
clientId: applicationConfig.clientID,
31-
authority: applicationConfig.authority,
32-
validateAuthority: true
37+
clientId: 'Enter_the_Application_Id_here', //This is your client ID
38+
authority: "https://login.microsoftonline.com/Enter_the_Tenant_Info_Here", //Default authority
3339
},
3440
cache: {
3541
cacheLocation: "localStorage",
3642
storeAuthStateInCookie: true
3743
}
3844
};
3945

40-
var myMSALObj = new Msal.UserAgentApplication(config);
46+
var graphConfig = {
47+
graphMeEndpoint: "https://graph.microsoft.com/v1.0/me"
48+
};
49+
50+
// this can be used for login or token request, however in more complex situations
51+
// this can have diverging options
52+
var request = {
53+
scopes: ["user.read"]
54+
};
55+
56+
var myMSALObj = new Msal.UserAgentApplication(msalConfig);
57+
// Register Callbacks for redirect flow
4158
myMSALObj.handleRedirectCallbacks(acquireTokenRedirectCallBack, acquireTokenErrorRedirectCallBack);
4259

4360
function signIn() {
44-
let loginRequest = {
45-
scopes: applicationConfig.graphScopes
46-
};
47-
myMSALObj.loginPopup(loginRequest).then(function (loginResponse) {
61+
62+
myMSALObj.loginPopup(request).then(function (loginResponse) {
4863
//Login Success
4964
showWelcomeMessage();
5065
acquireTokenPopupAndCallMSGraph();
@@ -59,18 +74,15 @@
5974

6075
function acquireTokenPopupAndCallMSGraph() {
6176
//Call acquireTokenSilent (iframe) to obtain a token for Microsoft Graph
62-
let tokenRequest = {
63-
scopes: applicationConfig.graphScopes
64-
};
65-
myMSALObj.acquireTokenSilent(tokenRequest).then(function (tokenResponse) {
66-
console.log(tokenResponse.scopes);
67-
callMSGraph(applicationConfig.graphEndpoint, tokenResponse.accessToken, graphAPICallback);
77+
78+
myMSALObj.acquireTokenSilent(request).then(function (tokenResponse) {
79+
callMSGraph(graphConfig.graphMeEndpoint, tokenResponse.accessToken, graphAPICallback);
6880
}).catch(function (error) {
69-
console.log(error);
81+
console.log(error.errorCode);
7082
// Call acquireTokenPopup (popup window) in case of acquireTokenSilent failure due to consent or interaction required ONLY
71-
if (requiresInteraction(error.errorMessage)) {
72-
myMSALObj.acquireTokenPopup(tokenRequest).then(function (tokenResponse) {
73-
callMSGraph(applicationConfig.graphEndpoint, tokenResponse.accessToken, graphAPICallback);
83+
if (requiresInteraction(error.errorCode)) {
84+
myMSALObj.acquireTokenPopup(request).then(function (tokenResponse) {
85+
callMSGraph(graphConfig.graphMeEndpoint, tokenResponse.accessToken, graphAPICallback);
7486
}).catch(function (error) {
7587
console.log(error);
7688
});
@@ -96,33 +108,29 @@
96108

97109
function showWelcomeMessage() {
98110
var divWelcome = document.getElementById('WelcomeMessage');
99-
divWelcome.innerHTML = 'Welcome ' + myMSALObj.getAccount().userName + "to Microsoft Graph API";
111+
divWelcome.innerHTML = "Welcome " + myMSALObj.getAccount().userName + " to Microsoft Graph API";
100112
var loginbutton = document.getElementById('SignIn');
101113
loginbutton.innerHTML = 'Sign Out';
102114
loginbutton.setAttribute('onclick', 'signOut();');
103115
}
104116

105-
106117
// This function can be removed if you do not need to support IE
107118
function acquireTokenRedirectAndCallMSGraph() {
108119
//Call acquireTokenSilent (iframe) to obtain a token for Microsoft Graph
109-
let tokenRequest = {
110-
scopes: applicationConfig.graphScopes
111-
};
112-
myMSALObj.acquireTokenSilent(tokenRequest).then(function (tokenResponse) {
113-
callMSGraph(applicationConfig.graphEndpoint, tokenResponse.accessToken, graphAPICallback);
120+
myMSALObj.acquireTokenSilent(request).then(function (tokenResponse) {
121+
callMSGraph(graphConfig.graphMeEndpoint, tokenResponse.accessToken, graphAPICallback);
114122
}).catch(function (error) {
115123
console.log(error);
116124
//Call acquireTokenRedirect in case of acquireToken Failure
117-
if (requiresInteraction(error.errorMessage)) {
118-
myMSALObj.acquireTokenRedirect(tokenRequest);
125+
if (requiresInteraction(error.errorCode)) {
126+
myMSALObj.acquireTokenRedirect(request);
119127
}
120128
});
121129
}
122130

123131
function acquireTokenRedirectCallBack(response) {
124132
if (response.tokenType === "access_token") {
125-
callMSGraph(applicationConfig.graphEndpoint, response.accessToken, graphAPICallback);
133+
callMSGraph(graphConfig.graphMeEndpoint, response.accessToken, graphAPICallback);
126134
} else {
127135
console.log("token type is:" + response.tokenType);
128136
}
@@ -132,42 +140,33 @@
132140
console.log(error);
133141
}
134142

135-
function requiresInteraction(errorMessage) {
136-
if (!errorMessage || !errorMessage.length) {
143+
function requiresInteraction(errorCode) {
144+
if (!errorCode || !errorCode.length) {
137145
return false;
138146
}
139-
return errorMessage.indexOf("consent_required") !== -1 ||
140-
errorMessage.indexOf("interaction_required") !== -1 ||
141-
errorMessage.indexOf("login_required") !== -1;
147+
return errorCode === "consent_required" ||
148+
errorCode === "interaction_required" ||
149+
errorCode === "login_required";
142150
}
143-
// Browser check variables
144-
var ua = window.navigator.userAgent;
145-
var msie = ua.indexOf('MSIE ');
146-
var msie11 = ua.indexOf('Trident/');
147-
var msedge = ua.indexOf('Edge/');
148-
var isIE = msie > 0 || msie11 > 0;
149-
var isEdge = msedge > 0;
150151

151-
//If you support IE, our recommendation is that you sign-in using Redirect APIs
152-
//If you as a developer are testing using Edge InPrivate mode, please add "isEdge" to the if check
153-
if (!isIE) {
152+
// runs on page load, change config to try different login types to see what is best for your application
153+
if (loginType === 'POPUP') {
154154
if (myMSALObj.getAccount()) {// avoid duplicate code execution on page load in case of iframe and popup window.
155155
showWelcomeMessage();
156156
acquireTokenPopupAndCallMSGraph();
157157
}
158158
}
159-
else {
159+
else if (loginType === 'REDIRECT') {
160160
document.getElementById("SignIn").onclick = function () {
161-
let redirectTokenRequest = {
162-
scopes: applicationConfig.graphScopes
163-
};
164-
myMSALObj.loginRedirect(redirectTokenRequest);
161+
myMSALObj.loginRedirect(request);
165162
};
166163

167164
if (myMSALObj.getAccount() && !myMSALObj.isCallback(window.location.hash)) {// avoid duplicate code execution on page load in case of iframe and popup window.
168165
showWelcomeMessage();
169166
acquireTokenRedirectAndCallMSGraph();
170167
}
168+
} else {
169+
console.error('Please set a valid login type');
171170
}
172171
</script>
173172
</body>

‎JavaScriptSPA/msal-0.9.0.min.js‎

Lines changed: 0 additions & 17 deletions
This file was deleted.

‎JavaScriptSPA/msal-1.0.0-preview.min.js‎

Lines changed: 17 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎JavaScriptSPA/style.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ body {
1010

1111
.leftContainer {
1212
color: white;
13-
font-size: 50px;
13+
font-size: 46px;
1414
font-weight: 200;
1515
text-align: center;
1616
}

0 commit comments

Comments
 (0)