initial commit

.devcontainer/devcontainer.json

@@ -0,0 +1,54 @@
+// For format details, see https://aka.ms/devcontainer.json. For config options, see the
+// README at: https://github.com/devcontainers/templates/tree/main/src/docker-existing-dockerfile
+{
+	"name": "Existing Dockerfile",
+	"build": {
+		// Sets the run context to one level up instead of the .devcontainer folder.
+		"context": "..",
+		// Update the 'dockerFile' property if you aren't using the standard 'Dockerfile' filename.
+		"dockerfile": "../Dockerfile"
+	}
+	// "features": {
+	// 	"ghcr.io/guiyomh/features/vim:0": {},
+	// 	"ghcr.io/devcontainers-community/npm-features/prettier:1": {
+	// 		"version": "latest"
+	// 	},
+	// 	"ghcr.io/jayree/devcontainer-features/npm-registry:1": {
+	// 		"registry": "@SCOPE:registry=https://npm.pkg.github.com\n//npm.pkg.github.com/:_authToken=${localEnv:GITHUB_TOKEN}"
+	// 	},
+	// 	"ghcr.io/bdsoha/devcontainers/custom-root-ca:1": {
+	// 		"bundle": true,
+	// 		"verify": true,
+	// 		"source": "https://netfree.link/cacert/isp/018/ca.crt"
+	// 	}
+	// }
+
+	// Features to add to the dev container. More info: https://containers.dev/features.
+	// "features": {},
+
+	// Use 'forwardPorts' to make a list of ports inside the container available locally.
+	// "forwardPorts": [],
+
+	// Uncomment the next line to run commands after the container is created.
+	// "postCreateCommand": "cat /etc/os-release",
+	// "postCreateCommand": "npm install -g @devcontainers/cli",
+	// "postCreateCommand": "npm install",
+
+	// Configure tool-specific properties.
+	// "customizations": {},
+	// "customizations": {
+	// 	"vscode": {
+	// 		"extensions": [
+	// 			"mads-hartmann.bash-ide-vscode",
+	// 			"dbaeumer.vscode-eslint",
+	// 			"editorconfig.editorconfig"
+	// 		]
+	// 	}
+	// }
+
+	// Uncomment to connect as an existing user other than the container default. More info: https://aka.ms/dev-containers-non-root.
+	// "remoteUser": "devcontainer"
+
+
+
+}

App/authConfig.js

@@ -0,0 +1,69 @@
+/**
+ * Configuration object to be passed to MSAL instance on creation. 
+ * For a full list of MSAL.js configuration parameters, visit:
+ * https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/docs/configuration.md 
+ */
+
+const msalConfig = {
+    auth: {
+        clientId: 'b954d729-c75e-418d-b2e4-1dd38ac8e865', // This is the ONLY mandatory field that you need to supply.
+        authority: 'https://login.microsoftonline.com/4d1df598-ac19-4734-86f0-8a645992dfa1', // Defaults to "https://login.microsoftonline.com/common"
+        redirectUri: 'https://it75-web-c8a-sampleapp-dev.azurewebsites.net/', // You must register this URI on Azure Portal/App Registration. Defaults to window.location.href e.g. http://localhost:3000/
+        navigateToLoginRequestUrl: true, // If "true", will navigate back to the original request location before processing the auth code response.
+    },
+    cache: {
+        cacheLocation: 'sessionStorage', // Configures cache location. "sessionStorage" is more secure, but "localStorage" gives you SSO.
+        storeAuthStateInCookie: false, // set this to true if you have to support IE
+    },
+    system: {
+        loggerOptions: {
+            loggerCallback: (level, message, containsPii) => {
+                if (containsPii) {
+                    return;
+                }
+                switch (level) {
+                    case msal.LogLevel.Error:
+                        console.error(message);
+                        return;
+                    case msal.LogLevel.Info:
+                        console.info(message);
+                        return;
+                    case msal.LogLevel.Verbose:
+                        console.debug(message);
+                        return;
+                    case msal.LogLevel.Warning:
+                        console.warn(message);
+                        return;
+                }
+            },
+        },
+    },
+};
+
+/**
+ * Scopes you add here will be prompted for user consent during sign-in.
+ * By default, MSAL.js will add OIDC scopes (openid, profile, email) to any login request.
+ * For more information about OIDC scopes, visit: 
+ * https://docs.microsoft.com/en-us/azure/active-directory/develop/v2-permissions-and-consent#openid-connect-scopes
+ */
+const loginRequest = {
+  scopes: ["openid", "profile"],
+};
+
+/**
+ * An optional silentRequest object can be used to achieve silent SSO
+ * between applications by providing a "login_hint" property.
+ */
+
+// const silentRequest = {
+//   scopes: ["openid", "profile"],
+//   loginHint: "[email protected]"
+// };
+
+// exporting config object for jest
+if (typeof exports !== 'undefined') {
+  module.exports = {
+      msalConfig: msalConfig,
+      loginRequest: loginRequest,
+  };
+}

App/authPopup.js

@@ -0,0 +1,97 @@
+// Create the main myMSALObj instance
+// configuration parameters are located at authConfig.js
+const myMSALObj = new msal.PublicClientApplication(msalConfig);
+
+let username = "";
+
+function selectAccount () {
+
+    /**
+     * See here for more info on account retrieval: 
+     * https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-common/docs/Accounts.md
+     */
+
+    const currentAccounts = myMSALObj.getAllAccounts();
+
+    if (!currentAccounts  || currentAccounts.length < 1) {
+        return;
+    } else if (currentAccounts.length > 1) {
+        // Add your account choosing logic here
+        console.warn("Multiple accounts detected.");
+    } else if (currentAccounts.length === 1) {
+        username = currentAccounts[0].username;
+        welcomeUser(username);
+        updateTable();
+    }
+}
+
+function handleResponse(response) {
+
+    /**
+     * To see the full list of response object properties, visit:
+     * https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/docs/request-response-object.md#response
+     */
+
+    if (response !== null) {
+        username = response.account.username;
+        welcomeUser(username);
+        updateTable();
+        UserDiv.innerHTML = `Welcome ${username}`;
+        TokenDiv.innerHTML = `Access token: ${response.accessToken}`;
+    } else {
+
+        selectAccount();
+
+        /**
+         * If you already have a session that exists with the authentication server, you can use the ssoSilent() API
+         * to make request for tokens without interaction, by providing a "login_hint" property. To try this, comment the 
+         * line above and uncomment the section below.
+         */
+
+        // myMSALObj.ssoSilent(silentRequest).
+        //     then(() => {
+        //         const currentAccounts = myMSALObj.getAllAccounts();
+        //         username = currentAccounts[0].username;
+        //         welcomeUser(username);
+        //         updateTable();
+        //     }).catch(error => {
+        //         console.error("Silent Error: " + error);
+        //         if (error instanceof msal.InteractionRequiredAuthError) {
+        //             signIn();
+        //         }
+        //     });
+    }
+}
+
+function signIn() {
+
+    /**
+     * You can pass a custom request object below. This will override the initial configuration. For more information, visit:
+     * https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/docs/request-response-object.md#request
+     */
+
+    myMSALObj.loginPopup(loginRequest)
+        .then(handleResponse)
+        .catch(error => {
+            console.error(error);
+        });
+}
+
+function signOut() {
+
+    /**
+     * You can pass a custom request object below. This will override the initial configuration. For more information, visit:
+     * https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/docs/request-response-object.md#request
+     */
+
+    // Choose which account to logout from by passing a username.
+    const logoutRequest = {
+        account: myMSALObj.getAccountByUsername(username),
+        mainWindowRedirectUri: 'http://localhost:3000/signout',
+        redirectUri: 'http://localhost:3000/redirect.html',
+    };
+
+    myMSALObj.logoutPopup(logoutRequest);
+}
+
+selectAccount();

App/authRedirect.js

@@ -0,0 +1,100 @@
+// Create the main myMSALObj instance
+// configuration parameters are located at authConfig.js
+const myMSALObj = new msal.PublicClientApplication(msalConfig);
+
+let username = "";
+
+/**
+ * A promise handler needs to be registered for handling the
+ * response returned from redirect flow. For more information, visit:
+ * 
+ */
+myMSALObj.handleRedirectPromise()
+    .then(handleResponse)
+    .catch((error) => {
+        console.error(error);
+    });
+
+function selectAccount () {
+
+    /**
+     * See here for more info on account retrieval: 
+     * https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-common/docs/Accounts.md
+     */
+
+    const currentAccounts = myMSALObj.getAllAccounts();
+
+    if (!currentAccounts) {
+        return;
+    } else if (currentAccounts.length > 1) {
+        // Add your account choosing logic here
+        console.warn("Multiple accounts detected.");
+    } else if (currentAccounts.length === 1) {
+        username = currentAccounts[0].username;
+        welcomeUser(username);
+        updateTable();
+    }
+}
+
+function handleResponse(response) {
+
+    /**
+     * To see the full list of response object properties, visit:
+     * https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/docs/request-response-object.md#response
+     */
+
+    if (response !== null) {
+        username = response.account.username;
+        welcomeUser(username);
+        updateTable();
+    } else {
+
+        selectAccount();
+
+        /**
+         * If you already have a session that exists with the authentication server, you can use the ssoSilent() API
+         * to make request for tokens without interaction, by providing a "login_hint" property. To try this, comment the 
+         * line above and uncomment the section below.
+         */
+
+        // myMSALObj.ssoSilent(silentRequest).
+        //     then(() => {
+        //         const currentAccounts = myMSALObj.getAllAccounts();
+        //         username = currentAccounts[0].username;
+        //         welcomeUser(username);
+        //         updateTable();
+        //     }).catch(error => {
+        //         console.error("Silent Error: " + error);
+        //         if (error instanceof msal.InteractionRequiredAuthError) {
+        //             signIn();
+        //         }
+        //     });
+    }
+}
+
+function signIn() {
+
+    /**
+     * You can pass a custom request object below. This will override the initial configuration. For more information, visit:
+     * https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/docs/request-response-object.md#request
+     */
+
+    myMSALObj.loginRedirect(loginRequest);
+}
+
+function signOut() {
+
+    /**
+     * You can pass a custom request object below. This will override the initial configuration. For more information, visit:
+     * https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/docs/request-response-object.md#request
+     */
+
+    // Choose which account to logout from by passing a username.
+    const logoutRequest = {
+        account: myMSALObj.getAccountByUsername(username),
+        postLogoutRedirectUri: 'http://localhost:3000/signout', // Simply remove this line if you would like navigate to index page after logout.
+
+    };
+
+    myMSALObj.logoutRedirect(logoutRequest);
+}