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

Commit b8694b7

Browse files
DarylThayil
authored andcommitted
add login type
1 parent c933c29 commit b8694b7

File tree

4 files changed

+72
-117
lines changed

4 files changed

+72
-117
lines changed

JavaScriptSPA/index.html

Lines changed: 55 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +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>
7-
<link rel="stylesheet" type="text/css" href="/style.css">
6+
<script src="/msal-1.0.0-preview.min.js"></script>
87
</head>
98

109
<body>
@@ -18,33 +17,48 @@
1817
</div>
1918
</div>
2019
<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-
};
2720

28-
var config = {
21+
// Browser check variables
22+
var ua = window.navigator.userAgent;
23+
var msie = ua.indexOf('MSIE ');
24+
var msie11 = ua.indexOf('Trident/');
25+
var msedge = ua.indexOf('Edge/');
26+
var isIE = msie > 0 || msie11 > 0;
27+
var isEdge = msedge > 0;
28+
//If you support IE, our recommendation is that you sign-in using Redirect APIs
29+
//If you as a developer are testing using Edge InPrivate mode, please add "isEdge" to the if check
30+
31+
// can change this to default an experience outside browser use
32+
var loginType = isIE ? "REDIRECT" : "POPUP";
33+
34+
var msalConfig = {
2935
auth: {
30-
clientId: applicationConfig.clientID,
31-
authority: applicationConfig.authority,
32-
validateAuthority: true
36+
clientId: '7f2f4dfb-013d-4570-96ad-451a9ebc87a6', //This is your client ID
37+
authority: "https://login.microsoftonline.com/common", //Default authority
3338
},
3439
cache: {
3540
cacheLocation: "localStorage",
3641
storeAuthStateInCookie: true
3742
}
3843
};
3944

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

4359
function signIn() {
44-
let loginRequest = {
45-
scopes: applicationConfig.graphScopes
46-
};
47-
myMSALObj.loginPopup(loginRequest).then(function (loginResponse) {
60+
61+
myMSALObj.loginPopup(request).then(function (loginResponse) {
4862
//Login Success
4963
showWelcomeMessage();
5064
acquireTokenPopupAndCallMSGraph();
@@ -59,18 +73,15 @@
5973

6074
function acquireTokenPopupAndCallMSGraph() {
6175
//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);
76+
77+
myMSALObj.acquireTokenSilent(request).then(function (tokenResponse) {
78+
callMSGraph(graphConfig.graphMeEndpoint, tokenResponse.accessToken, graphAPICallback);
6879
}).catch(function (error) {
69-
console.log(error);
80+
console.log(error.errorCode);
7081
// 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);
82+
if (requiresInteraction(error.errorCode)) {
83+
myMSALObj.acquireTokenPopup(request).then(function (tokenResponse) {
84+
callMSGraph(graphConfig.graphMeEndpoint, tokenResponse.accessToken, graphAPICallback);
7485
}).catch(function (error) {
7586
console.log(error);
7687
});
@@ -96,33 +107,29 @@
96107

97108
function showWelcomeMessage() {
98109
var divWelcome = document.getElementById('WelcomeMessage');
99-
divWelcome.innerHTML = 'Welcome ' + myMSALObj.getAccount().userName + "to Microsoft Graph API";
110+
divWelcome.innerHTML = "Welcome " + myMSALObj.getAccount().userName + " to Microsoft Graph API";
100111
var loginbutton = document.getElementById('SignIn');
101112
loginbutton.innerHTML = 'Sign Out';
102113
loginbutton.setAttribute('onclick', 'signOut();');
103114
}
104115

105-
106116
// This function can be removed if you do not need to support IE
107117
function acquireTokenRedirectAndCallMSGraph() {
108118
//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);
119+
myMSALObj.acquireTokenSilent(request).then(function (tokenResponse) {
120+
callMSGraph(graphConfig.graphMeEndpoint, tokenResponse.accessToken, graphAPICallback);
114121
}).catch(function (error) {
115122
console.log(error);
116123
//Call acquireTokenRedirect in case of acquireToken Failure
117-
if (requiresInteraction(error.errorMessage)) {
118-
myMSALObj.acquireTokenRedirect(tokenRequest);
124+
if (requiresInteraction(error.errorCode)) {
125+
myMSALObj.acquireTokenRedirect(request);
119126
}
120127
});
121128
}
122129

123130
function acquireTokenRedirectCallBack(response) {
124131
if (response.tokenType === "access_token") {
125-
callMSGraph(applicationConfig.graphEndpoint, response.accessToken, graphAPICallback);
132+
callMSGraph(graphConfig.graphMeEndpoint, response.accessToken, graphAPICallback);
126133
} else {
127134
console.log("token type is:" + response.tokenType);
128135
}
@@ -132,42 +139,33 @@
132139
console.log(error);
133140
}
134141

135-
function requiresInteraction(errorMessage) {
136-
if (!errorMessage || !errorMessage.length) {
142+
function requiresInteraction(errorCode) {
143+
if (!errorCode || !errorCode.length) {
137144
return false;
138145
}
139-
return errorMessage.indexOf("consent_required") !== -1 ||
140-
errorMessage.indexOf("interaction_required") !== -1 ||
141-
errorMessage.indexOf("login_required") !== -1;
146+
return errorCode === "consent_required" ||
147+
errorCode === "interaction_required" ||
148+
errorCode === "login_required";
142149
}
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;
150150

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) {
151+
// runs on page load, change config to try different login types to see what is best for your application
152+
if (loginType === 'POPUP') {
154153
if (myMSALObj.getAccount()) {// avoid duplicate code execution on page load in case of iframe and popup window.
155154
showWelcomeMessage();
156155
acquireTokenPopupAndCallMSGraph();
157156
}
158157
}
159-
else {
158+
else if (loginType === 'REDIRECT') {
160159
document.getElementById("SignIn").onclick = function () {
161-
let redirectTokenRequest = {
162-
scopes: applicationConfig.graphScopes
163-
};
164-
myMSALObj.loginRedirect(redirectTokenRequest);
160+
myMSALObj.loginRedirect(request);
165161
};
166162

167163
if (myMSALObj.getAccount() && !myMSALObj.isCallback(window.location.hash)) {// avoid duplicate code execution on page load in case of iframe and popup window.
168164
showWelcomeMessage();
169165
acquireTokenRedirectAndCallMSGraph();
170166
}
167+
} else {
168+
console.error('Please set a valid login type');
171169
}
172170
</script>
173171
</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: 0 additions & 43 deletions
This file was deleted.

0 commit comments

Comments
 (0)