@azure/msal-browser 3.0.1 → 3.1.0

package/src/interaction_handler/SilentHandler.ts

@@ -0,0 +1,266 @@
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
+
+import {
+    UrlString,
+    CommonAuthorizationCodeRequest,
+    AuthorizationCodeClient,
+    Constants,
+    Logger,
+    IPerformanceClient,
+    PerformanceEvents,
+} from "@azure/msal-common";
+import { InteractionHandler } from "./InteractionHandler";
+import {
+    createBrowserAuthError,
+    BrowserAuthErrorCodes,
+} from "../error/BrowserAuthError";
+import { BrowserCacheManager } from "../cache/BrowserCacheManager";
+import {
+    BrowserSystemOptions,
+    DEFAULT_IFRAME_TIMEOUT_MS,
+} from "../config/Configuration";
+
+export class SilentHandler extends InteractionHandler {
+    private navigateFrameWait: number;
+    private pollIntervalMilliseconds: number;
+
+    constructor(
+        authCodeModule: AuthorizationCodeClient,
+        storageImpl: BrowserCacheManager,
+        authCodeRequest: CommonAuthorizationCodeRequest,
+        logger: Logger,
+        systemOptions: Required<
+            Pick<
+                BrowserSystemOptions,
+                "navigateFrameWait" | "pollIntervalMilliseconds"
+            >
+        >,
+        performanceClient: IPerformanceClient
+    ) {
+        super(
+            authCodeModule,
+            storageImpl,
+            authCodeRequest,
+            logger,
+            performanceClient
+        );
+        this.navigateFrameWait = systemOptions.navigateFrameWait;
+        this.pollIntervalMilliseconds = systemOptions.pollIntervalMilliseconds;
+    }
+
+    /**
+     * Creates a hidden iframe to given URL using user-requested scopes as an id.
+     * @param urlNavigate
+     * @param userRequestScopes
+     */
+    async initiateAuthRequest(requestUrl: string): Promise<HTMLIFrameElement> {
+        this.performanceClient.addQueueMeasurement(
+            PerformanceEvents.SilentHandlerInitiateAuthRequest,
+            this.authCodeRequest.correlationId
+        );
+
+        if (!requestUrl) {
+            // Throw error if request URL is empty.
+            this.logger.info("Navigate url is empty");
+            throw createBrowserAuthError(
+                BrowserAuthErrorCodes.emptyNavigateUri
+            );
+        }
+
+        if (this.navigateFrameWait) {
+            this.performanceClient.setPreQueueTime(
+                PerformanceEvents.SilentHandlerLoadFrame,
+                this.authCodeRequest.correlationId
+            );
+            return await this.loadFrame(requestUrl);
+        }
+        return this.loadFrameSync(requestUrl);
+    }
+
+    /**
+     * Monitors an iframe content window until it loads a url with a known hash, or hits a specified timeout.
+     * @param iframe
+     * @param timeout
+     */
+    monitorIframeForHash(
+        iframe: HTMLIFrameElement,
+        timeout: number
+    ): Promise<string> {
+        this.performanceClient.addQueueMeasurement(
+            PerformanceEvents.SilentHandlerMonitorIframeForHash,
+            this.authCodeRequest.correlationId
+        );
+
+        return new Promise((resolve, reject) => {
+            if (timeout < DEFAULT_IFRAME_TIMEOUT_MS) {
+                this.logger.warning(
+                    `system.loadFrameTimeout or system.iframeHashTimeout set to lower (${timeout}ms) than the default (${DEFAULT_IFRAME_TIMEOUT_MS}ms). This may result in timeouts.`
+                );
+            }
+
+            /*
+             * Polling for iframes can be purely timing based,
+             * since we don't need to account for interaction.
+             */
+            const nowMark = window.performance.now();
+            const timeoutMark = nowMark + timeout;
+
+            const intervalId = setInterval(() => {
+                if (window.performance.now() > timeoutMark) {
+                    this.removeHiddenIframe(iframe);
+                    clearInterval(intervalId);
+                    reject(
+                        createBrowserAuthError(
+                            BrowserAuthErrorCodes.monitorWindowTimeout
+                        )
+                    );
+                    return;
+                }
+
+                let href: string = Constants.EMPTY_STRING;
+                const contentWindow = iframe.contentWindow;
+                try {
+                    /*
+                     * Will throw if cross origin,
+                     * which should be caught and ignored
+                     * since we need the interval to keep running while on STS UI.
+                     */
+                    href = contentWindow
+                        ? contentWindow.location.href
+                        : Constants.EMPTY_STRING;
+                } catch (e) {}
+
+                if (!href || href === "about:blank") {
+                    return;
+                }
+
+                const contentHash = contentWindow
+                    ? contentWindow.location.hash
+                    : Constants.EMPTY_STRING;
+                if (contentHash) {
+                    if (UrlString.hashContainsKnownProperties(contentHash)) {
+                        // Success case
+                        this.removeHiddenIframe(iframe);
+                        clearInterval(intervalId);
+                        resolve(contentHash);
+                        return;
+                    } else {
+                        // Hash is present but incorrect
+                        this.logger.error(
+                            "SilentHandler:monitorIFrameForHash - a hash is present in the iframe but it does not contain known properties. It's likely that the hash has been replaced by code running on the redirectUri page."
+                        );
+                        this.logger.errorPii(
+                            `SilentHandler:monitorIFrameForHash - the url detected in the iframe is: ${href}`
+                        );
+                        this.removeHiddenIframe(iframe);
+                        clearInterval(intervalId);
+                        reject(
+                            createBrowserAuthError(
+                                BrowserAuthErrorCodes.hashDoesNotContainKnownProperties
+                            )
+                        );
+                        return;
+                    }
+                } else {
+                    // No hash is present
+                    this.logger.error(
+                        "SilentHandler:monitorIFrameForHash - the request has returned to the redirectUri but a hash is not present in the iframe. It's likely that the hash has been removed or the page has been redirected by code running on the redirectUri page."
+                    );
+                    this.logger.errorPii(
+                        `SilentHandler:monitorIFrameForHash - the url detected in the iframe is: ${href}`
+                    );
+                    this.removeHiddenIframe(iframe);
+                    clearInterval(intervalId);
+                    reject(
+                        createBrowserAuthError(
+                            BrowserAuthErrorCodes.hashEmptyError
+                        )
+                    );
+                    return;
+                }
+            }, this.pollIntervalMilliseconds);
+        });
+    }
+
+    /**
+     * @hidden
+     * Loads iframe with authorization endpoint URL
+     * @ignore
+     */
+    private loadFrame(urlNavigate: string): Promise<HTMLIFrameElement> {
+        this.performanceClient.addQueueMeasurement(
+            PerformanceEvents.SilentHandlerLoadFrame,
+            this.authCodeRequest.correlationId
+        );
+
+        /*
+         * This trick overcomes iframe navigation in IE
+         * IE does not load the page consistently in iframe
+         */
+
+        return new Promise((resolve, reject) => {
+            const frameHandle = this.createHiddenIframe();
+
+            setTimeout(() => {
+                if (!frameHandle) {
+                    reject("Unable to load iframe");
+                    return;
+                }
+
+                frameHandle.src = urlNavigate;
+
+                resolve(frameHandle);
+            }, this.navigateFrameWait);
+        });
+    }
+
+    /**
+     * @hidden
+     * Loads the iframe synchronously when the navigateTimeFrame is set to `0`
+     * @param urlNavigate
+     * @param frameName
+     * @param logger
+     */
+    private loadFrameSync(urlNavigate: string): HTMLIFrameElement {
+        const frameHandle = this.createHiddenIframe();
+
+        frameHandle.src = urlNavigate;
+
+        return frameHandle;
+    }
+
+    /**
+     * @hidden
+     * Creates a new hidden iframe or gets an existing one for silent token renewal.
+     * @ignore
+     */
+    private createHiddenIframe(): HTMLIFrameElement {
+        const authFrame = document.createElement("iframe");
+
+        authFrame.style.visibility = "hidden";
+        authFrame.style.position = "absolute";
+        authFrame.style.width = authFrame.style.height = "0";
+        authFrame.style.border = "0";
+        authFrame.setAttribute(
+            "sandbox",
+            "allow-scripts allow-same-origin allow-forms"
+        );
+        document.getElementsByTagName("body")[0].appendChild(authFrame);
+
+        return authFrame;
+    }
+
+    /**
+     * @hidden
+     * Removes a hidden iframe from the page.
+     * @ignore
+     */
+    private removeHiddenIframe(iframe: HTMLIFrameElement): void {
+        if (document.body === iframe.parentNode) {
+            document.body.removeChild(iframe);
+        }
+    }
+}

package/src/navigation/INavigationClient.ts

@@ -0,0 +1,23 @@
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
+
+import { NavigationOptions } from "./NavigationOptions";
+
+export interface INavigationClient {
+    /**
+     * Navigates to other pages within the same web application
+     * Return false if this doesn't cause the page to reload i.e. Client-side navigation
+     * @param url
+     * @param options
+     */
+    navigateInternal(url: string, options: NavigationOptions): Promise<boolean>;
+
+    /**
+     * Navigates to other pages outside the web application i.e. the Identity Provider
+     * @param url
+     * @param options
+     */
+    navigateExternal(url: string, options: NavigationOptions): Promise<boolean>;
+}

package/src/navigation/NavigationClient.ts

@@ -0,0 +1,55 @@
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
+
+import { INavigationClient } from "./INavigationClient";
+import { NavigationOptions } from "./NavigationOptions";
+
+export class NavigationClient implements INavigationClient {
+    /**
+     * Navigates to other pages within the same web application
+     * @param url
+     * @param options
+     */
+    navigateInternal(
+        url: string,
+        options: NavigationOptions
+    ): Promise<boolean> {
+        return NavigationClient.defaultNavigateWindow(url, options);
+    }
+
+    /**
+     * Navigates to other pages outside the web application i.e. the Identity Provider
+     * @param url
+     * @param options
+     */
+    navigateExternal(
+        url: string,
+        options: NavigationOptions
+    ): Promise<boolean> {
+        return NavigationClient.defaultNavigateWindow(url, options);
+    }
+
+    /**
+     * Default navigation implementation invoked by the internal and external functions
+     * @param url
+     * @param options
+     */
+    private static defaultNavigateWindow(
+        url: string,
+        options: NavigationOptions
+    ): Promise<boolean> {
+        if (options.noHistory) {
+            window.location.replace(url);
+        } else {
+            window.location.assign(url);
+        }
+
+        return new Promise((resolve) => {
+            setTimeout(() => {
+                resolve(true);
+            }, options.timeout);
+        });
+    }
+}

package/src/navigation/NavigationOptions.ts

@@ -0,0 +1,18 @@
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
+
+import { ApiId } from "../utils/BrowserConstants";
+
+/**
+ * Additional information passed to the navigateInternal and navigateExternal functions
+ */
+export type NavigationOptions = {
+    /** The Id of the API that initiated navigation */
+    apiId: ApiId;
+    /** Suggested timeout (ms) based on the configuration provided to PublicClientApplication */
+    timeout: number;
+    /** When set to true the url should not be added to the browser history */
+    noHistory: boolean;
+};

package/src/network/FetchClient.ts

@@ -0,0 +1,130 @@
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
+
+import {
+    Constants,
+    INetworkModule,
+    NetworkRequestOptions,
+    NetworkResponse,
+} from "@azure/msal-common";
+import {
+    createBrowserAuthError,
+    BrowserAuthErrorCodes,
+} from "../error/BrowserAuthError";
+import { HTTP_REQUEST_TYPE } from "../utils/BrowserConstants";
+
+/**
+ * This class implements the Fetch API for GET and POST requests. See more here: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
+ */
+export class FetchClient implements INetworkModule {
+    /**
+     * Fetch Client for REST endpoints - Get request
+     * @param url
+     * @param headers
+     * @param body
+     */
+    async sendGetRequestAsync<T>(
+        url: string,
+        options?: NetworkRequestOptions
+    ): Promise<NetworkResponse<T>> {
+        let response;
+        try {
+            response = await fetch(url, {
+                method: HTTP_REQUEST_TYPE.GET,
+                headers: this.getFetchHeaders(options),
+            });
+        } catch (e) {
+            if (window.navigator.onLine) {
+                throw createBrowserAuthError(
+                    BrowserAuthErrorCodes.getRequestFailed
+                );
+            } else {
+                throw createBrowserAuthError(
+                    BrowserAuthErrorCodes.noNetworkConnectivity
+                );
+            }
+        }
+
+        try {
+            return {
+                headers: this.getHeaderDict(response.headers),
+                body: (await response.json()) as T,
+                status: response.status,
+            };
+        } catch (e) {
+            throw createBrowserAuthError(
+                BrowserAuthErrorCodes.failedToParseResponse
+            );
+        }
+    }
+
+    /**
+     * Fetch Client for REST endpoints - Post request
+     * @param url
+     * @param headers
+     * @param body
+     */
+    async sendPostRequestAsync<T>(
+        url: string,
+        options?: NetworkRequestOptions
+    ): Promise<NetworkResponse<T>> {
+        const reqBody = (options && options.body) || Constants.EMPTY_STRING;
+
+        let response;
+        try {
+            response = await fetch(url, {
+                method: HTTP_REQUEST_TYPE.POST,
+                headers: this.getFetchHeaders(options),
+                body: reqBody,
+            });
+        } catch (e) {
+            if (window.navigator.onLine) {
+                throw createBrowserAuthError(
+                    BrowserAuthErrorCodes.postRequestFailed
+                );
+            } else {
+                throw createBrowserAuthError(
+                    BrowserAuthErrorCodes.noNetworkConnectivity
+                );
+            }
+        }
+
+        try {
+            return {
+                headers: this.getHeaderDict(response.headers),
+                body: (await response.json()) as T,
+                status: response.status,
+            };
+        } catch (e) {
+            throw createBrowserAuthError(
+                BrowserAuthErrorCodes.failedToParseResponse
+            );
+        }
+    }
+
+    /**
+     * Get Fetch API Headers object from string map
+     * @param inputHeaders
+     */
+    private getFetchHeaders(options?: NetworkRequestOptions): Headers {
+        const headers = new Headers();
+        if (!(options && options.headers)) {
+            return headers;
+        }
+        const optionsHeaders = options.headers;
+        Object.keys(optionsHeaders).forEach((key) => {
+            headers.append(key, optionsHeaders[key]);
+        });
+        return headers;
+    }
+
+    private getHeaderDict(headers: Headers): Record<string, string> {
+        const headerDict: Record<string, string> = {};
+        headers.forEach((value: string, key: string) => {
+            headerDict[key] = value;
+        });
+        return headerDict;
+    }
+}

package/src/operatingcontext/BaseOperatingContext.ts

@@ -0,0 +1,82 @@
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
+
+import { Logger } from "@azure/msal-common";
+import {
+    BrowserConfiguration,
+    buildConfiguration,
+    Configuration,
+} from "../config/Configuration";
+import { version, name } from "../packageMetadata";
+
+/**
+ * Base class for operating context
+ * Operating contexts are contexts in which MSAL.js is being run
+ * More than one operating context may be available at a time
+ * It's important from a logging and telemetry point of view for us to be able to identify the operating context.
+ * For example: Some operating contexts will pre-cache tokens impacting performance telemetry
+ */
+export abstract class BaseOperatingContext {
+    protected logger: Logger;
+    protected config: BrowserConfiguration;
+    protected available: boolean;
+    protected browserEnvironment: boolean;
+
+    constructor(config: Configuration) {
+        /*
+         * If loaded in an environment where window is not available,
+         * set internal flag to false so that further requests fail.
+         * This is to support server-side rendering environments.
+         */
+        this.browserEnvironment = typeof window !== "undefined";
+
+        this.config = buildConfiguration(config, this.browserEnvironment);
+        this.logger = new Logger(
+            this.config.system.loggerOptions,
+            name,
+            version
+        );
+        this.available = false;
+    }
+
+    /**
+     * returns the name of the module containing the API controller associated with this operating context
+     */
+    abstract getModuleName(): string;
+
+    /**
+     * returns the string identifier of this operating context
+     */
+    abstract getId(): string;
+
+    /**
+     * returns a boolean indicating whether this operating context is present
+     */
+    abstract initialize(): Promise<boolean>;
+
+    /**
+     * Return the MSAL config
+     * @returns BrowserConfiguration
+     */
+    getConfig(): BrowserConfiguration {
+        return this.config;
+    }
+
+    /**
+     * Returns the MSAL Logger
+     * @returns Logger
+     */
+    getLogger(): Logger {
+        return this.logger;
+    }
+
+    isAvailable(): boolean {
+        return this.available;
+    }
+
+    isBrowserEnvironment(): boolean {
+        return this.browserEnvironment;
+    }
+}

package/src/operatingcontext/StandardOperatingContext.ts

@@ -0,0 +1,49 @@
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
+
+import { BaseOperatingContext } from "./BaseOperatingContext";
+
+export class StandardOperatingContext extends BaseOperatingContext {
+    /*
+     * TODO: Once we have determine the bundling code return here to specify the name of the bundle
+     * containing the implementation for this operating context
+     */
+    static readonly MODULE_NAME: string = "";
+
+    /**
+     * Unique identifier for the operating context
+     */
+    static readonly ID: string = "StandardOperatingContext";
+
+    /**
+     * Return the module name.  Intended for use with import() to enable dynamic import
+     * of the implementation associated with this operating context
+     * @returns
+     */
+    getModuleName(): string {
+        return StandardOperatingContext.MODULE_NAME;
+    }
+    /**
+     * Returns the unique identifier for this operating context
+     * @returns string
+     */
+    getId(): string {
+        return StandardOperatingContext.ID;
+    }
+
+    /**
+     * Checks whether the operating context is available.
+     * Confirms that the code is running a browser rather.  This is required.
+     * @returns Promise<boolean> indicating whether this operating context is currently available.
+     */
+    async initialize(): Promise<boolean> {
+        this.available = typeof window !== "undefined";
+        return this.available;
+        /*
+         * NOTE: The standard context is available as long as there is a window.  If/when we split out WAM from Browser
+         * We can move the current contents of the initialize method to here and verify that the WAM extension is available
+         */
+    }
+}

package/src/operatingcontext/TeamsAppOperatingContext.ts

@@ -0,0 +1,48 @@
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
+
+import { BaseOperatingContext } from "./BaseOperatingContext";
+
+export class TeamsAppOperatingContext extends BaseOperatingContext {
+    /*
+     * TODO: Once we have determine the bundling code return here to specify the name of the bundle
+     * containing the implementation for this operating context
+     */
+    static readonly MODULE_NAME: string = "";
+
+    /**
+     * Unique identifier for the operating context
+     */
+    static readonly ID: string = "TeamsAppOperatingContext";
+
+    /**
+     * Return the module name.  Intended for use with import() to enable dynamic import
+     * of the implementation associated with this operating context
+     * @returns
+     */
+    getModuleName(): string {
+        return TeamsAppOperatingContext.MODULE_NAME;
+    }
+    /**
+     * Returns the unique identifier for this operating context
+     * @returns string
+     */
+    getId(): string {
+        return TeamsAppOperatingContext.ID;
+    }
+
+    /**
+     * Checks whether the operating context is available.
+     * Confirms that the code is running a browser rather.  This is required.
+     * @returns Promise<boolean> indicating whether this operating context is currently available.
+     */
+    async initialize(): Promise<boolean> {
+        /*
+         * TODO: Add implementation to check for presence of inject MetaOSHub JavaScript interface
+         * TODO: Make pre-flight token request to ensure that App is eligible to use Nested App Auth
+         */
+        return false;
+    }
+}

package/src/packageMetadata.ts

@@ -0,0 +1,3 @@
+/* eslint-disable header/header */
+export const name = "@azure/msal-browser";
+export const version = "3.1.0";

package/src/request/AuthorizationCodeRequest.ts

@@ -0,0 +1,19 @@
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
+
+import { CommonAuthorizationCodeRequest } from "@azure/msal-common";
+
+export type AuthorizationCodeRequest = Partial<
+    Omit<
+        CommonAuthorizationCodeRequest,
+        "code" | "enableSpaAuthorizationCode" | "requestedClaimsHash"
+    >
+> & {
+    code?: string;
+    nativeAccountId?: string;
+    cloudGraphHostName?: string;
+    msGraphHost?: string;
+    cloudInstanceHostName?: string;
+};