@pushwoosh/http-client 2.12.0 → 2.13.1

package/http-client.main.js

@@ -0,0 +1,524 @@
+import Cookies from 'js-cookie';
+import { jwtDecode } from 'jwt-decode';
+import { LogicError, UnauthorizedError, UnprocessableEntityError } from './http-client.errors';
+import { updatePath } from './http-client.helpers';
+import { Method } from './http-client.types';
+export class HttpClient {
+  /**
+   * Cookie name used to save the authorization state
+   * For more information see https://www.rfc-editor.org/rfc/rfc6749.html#section-4.1.1
+   */
+  static AUTHORIZATION_STATE_COOKIE_NAME = '__PW_AUTHORIZATION_STATE';
+  static AUTHORIZATION_STATE_SESSION_KEY = '__PW_SESSION_AUTHORIZATION_STATE';
+  static URL_BEFORE_AUTHORIZATION_SESSION_KEY = '__PW_SESSION_URL_BEFORE_AUTHORIZATION';
+  /**
+   * Cookie name used to save the page address before authorization
+   */
+  static URL_BEFORE_AUTHORIZATION_COOKIE_NAME = '__PW_URL_BEFORE_AUTHORIZATION';
+  /**
+   * Base URL for requests
+   */
+  baseURL;
+  /**
+   * API for working with navigation
+   */
+  history;
+  /**
+   * Http Client configuration
+   */
+  config;
+  /**
+   * Access token used to access protected resources
+   * For more information see https://www.rfc-editor.org/rfc/rfc6749.html#section-1.4
+   */
+  accessToken;
+  /**
+   * Refresh token used to refresh the access token.
+   * For more information see https://www.rfc-editor.org/rfc/rfc6749.html#section-1.5
+   */
+  refreshToken;
+  /**
+   * Is token refresh in progress
+   */
+  isRefreshing;
+  /**
+   * Email or username of the logged in user.
+   * Taken from jwt (claims).
+   */
+  userName;
+  /**
+   * Account ID under which the user is logged in.
+   * Taken from jwt (claims).
+   */
+  accountID;
+  /**
+   * Create an instance of the class
+   *
+   * @param history - API for working with navigation
+   * @param config - Http Client configuration
+   */
+  constructor(history, config) {
+    const {
+      baseURL
+    } = config;
+    this.baseURL = baseURL;
+    this.history = history;
+    this.config = config;
+    this.accessToken = null;
+    this.refreshToken = null;
+    this.isRefreshing = false;
+    this.userName = '';
+    this.accountID = '';
+  }
+  /**
+   * Check for authorization
+   *
+   * @param details - request details to protected resources
+   */
+  checkAuthorization = async details => {
+    // if the token refresh process is in progress, wait 100 ms and try to check the authorization again
+    if (this.isRefreshing) {
+      await new Promise(resolve => {
+        setTimeout(resolve, 100);
+      });
+      await this.checkAuthorization(details);
+      return;
+    }
+    // if there is no access token, then the client is definitely not authorized
+    if (!this.accessToken) {
+      throw new UnauthorizedError('Unauthorized!', details);
+    }
+    // if the token lifetime has expired, you need to try to update it using the refresh token
+    const currentTime = new Date().getTime() / 1000;
+    const introspect = jwtDecode(this.accessToken);
+    const isTokenExpired = introspect.expired_at < currentTime;
+    if (isTokenExpired) {
+      await this.updateTokenByRefreshToken(details);
+      await this.checkAuthorization(details);
+    }
+  };
+  /**
+   * Update access token
+   * For more information see:
+   * https://www.rfc-editor.org/rfc/rfc6749.html#section-4.1.3
+   * https://www.rfc-editor.org/rfc/rfc6749.html#section-6
+   *
+   * @param query - query parameters involved in the update
+   */
+  updateToken = async query => {
+    // client identification is done using the header
+    const clientIdInBase64 = btoa(`${this.config.clientId}:`);
+    const authorizationHeader = `Basic ${clientIdInBase64}`;
+    try {
+      this.isRefreshing = true;
+      const tokens = await this.post(this.config.urls.token, {
+        headers: {
+          Authorization: authorizationHeader
+        },
+        query,
+        withAuthorization: false,
+        withCredentials: true
+      });
+      this.accessToken = tokens.access_token;
+      this.refreshToken = tokens.refresh_token;
+      this.isRefreshing = false;
+    } catch (error) {
+      this.accessToken = null;
+      this.refreshToken = null;
+      this.isRefreshing = false;
+      throw error;
+    }
+  };
+  /**
+   * Update access token using authorization code
+   * For more information see: https://www.rfc-editor.org/rfc/rfc6749.html#section-4.1.3
+   *
+   * @param authorizationCode - authorization code received from the authorization server
+   */
+  updateTokenByAuthorizationCode = async authorizationCode => {
+    await this.updateToken({
+      grant_type: 'authorization_code',
+      code: authorizationCode,
+      redirect_uri: `${window.location.origin}${window.location.pathname}`
+    });
+  };
+  /**
+   * Update access token using refresh token
+   * For more information see: https://www.rfc-editor.org/rfc/rfc6749.html#section-6
+   *
+   * @param details - request details to protected resources
+   */
+  updateTokenByRefreshToken = async details => {
+    if (!this.refreshToken) {
+      this.accessToken = null;
+      throw new UnauthorizedError('Unauthorized!', details);
+    }
+    await this.updateToken({
+      grant_type: 'refresh_token',
+      refresh_token: this.refreshToken,
+      username: this.userName,
+      account_id: this.accountID
+    });
+  };
+  /**
+   * Process response from fetch request
+   *
+   * @param response - fetch response
+   * @param details - request details
+   * @param responseMiddleware - middleware to process response
+   */
+  processFetchResponse = async (response, details, responseMiddleware) => {
+    let data;
+    if (response.headers.get('Content-Type')?.includes('application/json')) {
+      data = await response.json().catch(() => ({}));
+    } else {
+      data = await response.text().then(str => {
+        try {
+          return JSON.parse(str);
+        } catch {
+          return str;
+        }
+      }).catch(() => '');
+    }
+    return responseMiddleware({
+      result: data,
+      status: response.status,
+      message: response.statusText,
+      details
+    });
+  };
+  /**
+   * Build fetch request URL, headers, and options from the given parameters.
+   * Shared by both `request()` and `stream()`.
+   */
+  buildFetchRequest = async (url, method, options) => {
+    // Initialize fetch request
+    let fetchUrl = url;
+    // Apply base URL if present
+    if (this.baseURL && !fetchUrl.startsWith('http')) {
+      fetchUrl = `${this.baseURL}${fetchUrl.startsWith('/') ? '' : '/'}${fetchUrl}`;
+    }
+    // Apply URL parameters
+    if (options.params) {
+      fetchUrl = updatePath(fetchUrl, options.params);
+    }
+    // Apply query parameters
+    if (options.query) {
+      const queryParams = options.query;
+      let queryString;
+      if (typeof queryParams === 'string') {
+        queryString = queryParams;
+      } else if (queryParams instanceof URLSearchParams) {
+        queryString = queryParams.toString();
+      } else {
+        queryString = new URLSearchParams(queryParams).toString();
+      }
+      fetchUrl = `${fetchUrl}${fetchUrl.includes('?') ? '&' : '?'}${queryString}`;
+    }
+    // Initialize request headers
+    const headers = options.headers || {};
+    const headersInit = {};
+    // Convert headers object to proper format
+    Object.entries(headers).forEach(([key, value]) => {
+      headersInit[key] = String(value);
+    });
+    // Add authorization header if needed
+    if (options.withAuthorization) {
+      await this.checkAuthorization(null);
+      headersInit.Authorization = `Bearer ${this.accessToken}`;
+    }
+    // Initialize request options
+    const fetchOptions = {
+      method,
+      headers: headersInit,
+      credentials: options.withCredentials ? 'include' : 'same-origin',
+      signal: options.signal
+    };
+    // Add body if needed
+    if (options.body !== undefined) {
+      if (options.body instanceof FormData) {
+        fetchOptions.body = options.body;
+      } else {
+        headersInit['Content-Type'] = 'application/json';
+        if (method !== Method.GET) {
+          fetchOptions.body = JSON.stringify(options.body);
+        }
+      }
+    }
+    return {
+      fetchUrl,
+      fetchOptions,
+      headersInit
+    };
+  };
+  /**
+   * Make a request
+   *
+   * @param url - request address
+   * @param method - request method
+   * @param options - request configuration
+   */
+  request = async (url, method, options) => {
+    const {
+      basicErrorMiddleware,
+      basicResponseMiddleware
+    } = this.config;
+    const {
+      errorMiddleware = basicErrorMiddleware,
+      responseMiddleware = basicResponseMiddleware
+    } = options;
+    // form request details
+    const details = {
+      url,
+      method,
+      headers: options.headers,
+      params: options.params,
+      query: options.query,
+      body: options.body,
+      withCredentials: options.withCredentials,
+      withAuthorization: options.withAuthorization
+    };
+    // the cast is needed only because RequestOptions is a conditional type over
+    // generics that are still unresolved here
+    const {
+      fetchUrl,
+      fetchOptions,
+      headersInit
+    } = await this.buildFetchRequest(url, method, options);
+    // the request can be made twice if an UnauthorizedError occurred,
+    // to have the opportunity to automatically update the access token using the refresh token
+    try {
+      const response = await fetch(fetchUrl, fetchOptions);
+      return await this.processFetchResponse(response, details, responseMiddleware);
+    } catch (firstError) {
+      // if the error that occurred during the first request is not Unauthorized, then pass it further
+      if (!(firstError instanceof UnauthorizedError)) {
+        await errorMiddleware(firstError);
+        // if for some reason an exception is not thrown in errorMiddleware, we do it for it
+        throw firstError;
+      }
+      // second attempt to make the request, but now with token update
+      try {
+        if (options.withAuthorization) {
+          await this.updateTokenByRefreshToken(details);
+          await this.checkAuthorization(details);
+          headersInit.Authorization = `Bearer ${this.accessToken}`;
+        }
+        const response = await fetch(fetchUrl, fetchOptions);
+        return await this.processFetchResponse(response, details, responseMiddleware);
+      } catch (secondError) {
+        await errorMiddleware(secondError);
+        // if for some reason an exception is not thrown in errorMiddleware, we do it for it
+        throw secondError;
+      }
+    }
+  };
+  /**
+   * Make a streaming request that returns the raw Response.
+   * Use this for NDJSON, SSE, or other streaming protocols where
+   * you need access to response.body (ReadableStream).
+   *
+   * @param url - request address
+   * @param method - request method
+   * @param options - stream request configuration
+   */
+  stream = async (url, method, options) => {
+    const {
+      basicErrorMiddleware
+    } = this.config;
+    const {
+      errorMiddleware = basicErrorMiddleware
+    } = options;
+    const {
+      fetchUrl,
+      fetchOptions,
+      headersInit
+    } = await this.buildFetchRequest(url, method, options);
+    const details = {
+      url,
+      method,
+      params: options.params,
+      query: options.query,
+      body: options.body,
+      withCredentials: options.withCredentials,
+      withAuthorization: options.withAuthorization
+    };
+    const {
+      basicResponseMiddleware
+    } = this.config;
+    try {
+      const response = await fetch(fetchUrl, fetchOptions);
+      if (!response.ok) {
+        // Delegate to processFetchResponse to get proper typed errors (BadRequestError, etc.)
+        await this.processFetchResponse(response, details, basicResponseMiddleware);
+      }
+      return response;
+    } catch (firstError) {
+      if (!(firstError instanceof UnauthorizedError)) {
+        await errorMiddleware(firstError);
+        throw firstError;
+      }
+      // Retry with token refresh
+      try {
+        if (options.withAuthorization) {
+          await this.updateTokenByRefreshToken(details);
+          await this.checkAuthorization(details);
+          headersInit.Authorization = `Bearer ${this.accessToken}`;
+        }
+        const response = await fetch(fetchUrl, fetchOptions);
+        if (!response.ok) {
+          await this.processFetchResponse(response, details, basicResponseMiddleware);
+        }
+        return response;
+      } catch (secondError) {
+        await errorMiddleware(secondError);
+        throw secondError;
+      }
+    }
+  };
+  /**
+   * Perform GET request
+   *
+   * @param url - request address
+   * @param options - GET request configuration
+   */
+  get = (url, options) => this.request(url, Method.GET, options);
+  /**
+   * Perform POST request
+   *
+   * @param url - request address
+   * @param options - POST request configuration
+   */
+  post = (url, options) => this.request(url, Method.POST, options);
+  /**
+   * Perform PUT request
+   *
+   * @param url - request address
+   * @param options - PUT request configuration
+   */
+  put = (url, options) => this.request(url, Method.PUT, options);
+  /**
+   * Perform PATCH request
+   *
+   * @param url - request address
+   * @param options - PATCH request configuration
+   */
+  patch = (url, options) => this.request(url, Method.PATCH, options);
+  /**
+   * Perform DELETE request
+   *
+   * @param url - request address
+   * @param options - DELETE request configuration
+   */
+  delete = (url, options) => this.request(url, Method.DELETE, options);
+  /**
+   * Address to return to once authorization completes
+   */
+  static resolveUrlBeforeAuthorization() {
+    const stored = sessionStorage.getItem(HttpClient.URL_BEFORE_AUTHORIZATION_SESSION_KEY);
+    // SSO can bounce the browser back to `origin + pathname` to re-issue /authorize, and by then
+    // the query string is already gone: reuse the stored address, but only for that same page
+    if (stored && HttpClient.isCurrentDocument(stored)) {
+      return stored;
+    }
+    return window.location.href;
+  }
+  /**
+   * Does the URL address the page the browser is on right now, query and hash aside
+   */
+  static isCurrentDocument(url) {
+    try {
+      const parsed = new URL(url);
+      return parsed.origin === window.location.origin && parsed.pathname === window.location.pathname;
+    } catch {
+      return false;
+    }
+  }
+  /**
+   * Perform the first step of client authorization
+   * For more information see https://www.rfc-editor.org/rfc/rfc6749.html#section-4.1.1
+   */
+  login = async () => {
+    const newAuthorizationState = Math.random().toString().slice(2, 12);
+    // Store in sessionStorage (per-tab)
+    sessionStorage.setItem(HttpClient.AUTHORIZATION_STATE_SESSION_KEY, newAuthorizationState);
+    const urlBeforeAuthorization = HttpClient.resolveUrlBeforeAuthorization();
+    sessionStorage.setItem(HttpClient.URL_BEFORE_AUTHORIZATION_SESSION_KEY, urlBeforeAuthorization);
+    // Also store in cookie as fallback for cross-domain scenarios
+    Cookies.set(HttpClient.AUTHORIZATION_STATE_COOKIE_NAME, newAuthorizationState);
+    // URL in cookie - it gets overwritten by other tabs!!!
+    Cookies.set(HttpClient.URL_BEFORE_AUTHORIZATION_COOKIE_NAME, urlBeforeAuthorization);
+    const searchParams = new URLSearchParams({
+      response_type: 'code',
+      client_id: this.config.clientId,
+      redirect_uri: `${window.location.origin}${window.location.pathname}`,
+      state: newAuthorizationState
+    });
+    window.location.href = `${this.config.urls.authorize}?${searchParams.toString()}`;
+  };
+  /**
+   * Perform the second step of client authorization
+   * For more information see https://www.rfc-editor.org/rfc/rfc6749.html#section-4.1.3
+   *
+   * @param authorization - client authorization data on the server
+   */
+  authorize = async authorization => {
+    // Try sessionStorage first (per-tab), then fallback to cookie
+    const storedAuthorizationState = sessionStorage.getItem(HttpClient.AUTHORIZATION_STATE_SESSION_KEY) || Cookies.get(HttpClient.AUTHORIZATION_STATE_COOKIE_NAME);
+    // Read from sessionStorage first (per-tab), then cookie
+    const storedAuthorizationUrl = sessionStorage.getItem(HttpClient.URL_BEFORE_AUTHORIZATION_SESSION_KEY) || Cookies.get(HttpClient.URL_BEFORE_AUTHORIZATION_COOKIE_NAME);
+    // Clean up
+    sessionStorage.removeItem(HttpClient.AUTHORIZATION_STATE_SESSION_KEY);
+    sessionStorage.removeItem(HttpClient.URL_BEFORE_AUTHORIZATION_SESSION_KEY);
+    Cookies.remove(HttpClient.AUTHORIZATION_STATE_COOKIE_NAME);
+    Cookies.remove(HttpClient.URL_BEFORE_AUTHORIZATION_COOKIE_NAME);
+    if (storedAuthorizationUrl) {
+      const url = new URL(storedAuthorizationUrl);
+      this.history.replace({
+        pathname: url.pathname,
+        search: url.search,
+        hash: url.hash
+      });
+    }
+    if (storedAuthorizationState !== authorization.state) {
+      throw new UnprocessableEntityError('Stored authorization state and received authorization state are not equal!');
+    }
+    await this.updateTokenByAuthorizationCode(authorization.code);
+    if (!this.accessToken) {
+      throw new LogicError('Access token is null after tokens update!');
+    }
+    const introspect = jwtDecode(this.accessToken);
+    this.userName = introspect.username;
+    this.accountID = introspect.account_id.toString();
+    return introspect;
+  };
+  /**
+   * End the session
+   */
+  logout = async () => {
+    this.accessToken = null;
+    this.refreshToken = null;
+    await this.get(this.config.urls.logout, {
+      withAuthorization: false,
+      withCredentials: true
+    });
+  };
+  /**
+   * Get access token
+   */
+  getAccessToken = async () => {
+    await this.checkAuthorization(null);
+    if (!this.accessToken) {
+      throw new LogicError('Access token is null after authorization check!');
+    }
+    return this.accessToken;
+  };
+  /**
+   * Manually set the access token
+   *
+   * @param accessToken - access token
+   */
+  setAccessToken = accessToken => {
+    this.accessToken = accessToken;
+  };
+}

package/{dist/http-client.types.d.ts → http-client.types.d.ts}

@@ -96,4 +96,3 @@ export type StreamOptions = FetchRequestOptions & {
     readonly errorMiddleware?: (error: unknown) => Promise<never> | never;
 };
 export {};
-//# sourceMappingURL=http-client.types.d.ts.map

package/http-client.types.js

@@ -0,0 +1,8 @@
+export var Method;
+(function (Method) {
+  Method["GET"] = "GET";
+  Method["POST"] = "POST";
+  Method["PUT"] = "PUT";
+  Method["PATCH"] = "PATCH";
+  Method["DELETE"] = "DELETE";
+})(Method || (Method = {}));

package/{dist/http-client.utilities.d.ts → http-client.utilities.d.ts}

@@ -17,4 +17,3 @@ export declare function defaultResponseMiddleware<R extends Result>(response: Re
  * @param error - error.
  */
 export declare function defaultErrorMiddleware(error: unknown): never;
-//# sourceMappingURL=http-client.utilities.d.ts.map

package/http-client.utilities.js

@@ -0,0 +1,63 @@
+import { BadGatewayError, BadRequestError, ForbiddenError, GatewayTimeoutError, InternalServerError, MethodNotAllowedError, NotFoundError, NotImplementedError, PayloadTooLargeError, ServiceUnavailableError, TooManyRequestsError, UnauthorizedError, UnprocessableEntityError, UnsupportedMediaTypeError, UntiledError } from './http-client.errors';
+/**
+ * Check if the request was successful.
+ *
+ * @param response - response from the server.
+ */
+export function checkIsResponseSuccess(response) {
+  return response.status >= 200 && response.status < 300;
+}
+/**
+ * Default server response handler.
+ *
+ * @param response - response from the server.
+ */
+export function defaultResponseMiddleware(response) {
+  if (checkIsResponseSuccess(response)) {
+    return response.result;
+  }
+  // The response may contain an empty string as message, for example from nginx.
+  // In errors we expect undefined as an empty value to replace it with status.
+  // Therefore, we leave undefined as the last value in the logical operator when response.message is empty.
+  const message = response.result?.message || response.message || undefined;
+  switch (response.status) {
+    case 400:
+      throw new BadRequestError(message, response.details);
+    case 401:
+      throw new UnauthorizedError(message, response.details);
+    case 403:
+      throw new ForbiddenError(message, response.details);
+    case 404:
+      throw new NotFoundError(message, response.details);
+    case 405:
+      throw new MethodNotAllowedError(message, response.details);
+    case 413:
+      throw new PayloadTooLargeError(message, response.details);
+    case 415:
+      throw new UnsupportedMediaTypeError(message, response.details);
+    case 422:
+      throw new UnprocessableEntityError(message, response.details);
+    case 429:
+      throw new TooManyRequestsError(message, response.details);
+    case 500:
+      throw new InternalServerError(message, response.details);
+    case 501:
+      throw new NotImplementedError(message, response.details);
+    case 502:
+      throw new BadGatewayError(message, response.details);
+    case 503:
+      throw new ServiceUnavailableError(message, response.details);
+    case 504:
+      throw new GatewayTimeoutError(message, response.details);
+    default:
+      throw new UntiledError(message || 'Untiled Error!', response.status, response.details);
+  }
+}
+/**
+ * Default error handler.
+ *
+ * @param error - error.
+ */
+export function defaultErrorMiddleware(error) {
+  throw error;
+}

package/{dist/index.d.ts → index.d.ts}

@@ -2,4 +2,3 @@ export * from './http-client.errors';
 export * from './http-client.main';
 export * from './http-client.types';
 export * from './http-client.utilities';
-//# sourceMappingURL=index.d.ts.map

package/index.js

@@ -0,0 +1,4 @@
+export * from './http-client.errors';
+export * from './http-client.main';
+export * from './http-client.types';
+export * from './http-client.utilities';

package/package.json

@@ -1,24 +1,24 @@
 {
   "name": "@pushwoosh/http-client",
-  "version": "2.12.0",
+  "version": "2.13.1",
   "description": "HTTP client with OAuth2 for Pushwoosh micro-frontends",
   "repository": {
     "type": "git",
     "url": "git+https://gitlab.corp.pushwoosh.com/frontend/frontend-monorepo.git",
     "directory": "packages/http-client"
   },
-  "main": "./dist/index.mjs",
-  "module": "./dist/index.mjs",
-  "types": "./dist/index.d.ts",
+  "main": "index.js",
+  "module": "index.js",
+  "types": "index.d.ts",
+  "sideEffects": false,
   "publishConfig": {
-    "access": "public"
+    "access": "public",
+    "directory": "dist"
   },
-  "files": [
-    "dist"
-  ],
   "pushwoosh": {
     "cdn": {
       "path": "http-client",
+      "dir": "cdn-dist",
       "importMap": [
         "@frontend/http-client",
         "@pushwoosh/http-client"
@@ -31,7 +31,7 @@
     "path-to-regexp": "^6.2.0"
   },
   "devDependencies": {
-    "@pushwoosh/frontend-builder-engine": "^4.0.0",
+    "@pushwoosh/frontend-builder-engine": "^5.5.0",
     "@types/history": "^4.7.11",
     "@types/js-cookie": "^3.0.1",
     "typescript": "^6.0.3"
@@ -40,13 +40,11 @@
     "node": ">= 24"
   },
   "scripts": {
-    "clean": "rm -rf dist",
-    "build": "pnpm run clean && pnpm run build:types && `pushwoosh-engine app:command:build`",
-    "build:types": "tsc --project tsconfig.json",
+    "build": "pushwoosh-engine lib:build && `pushwoosh-engine app:command:build`",
     "analyze": "`pushwoosh-engine app:command:analyze`",
     "check": "pnpm run check:lint && pnpm run check:types",
     "check:lint": "echo \"Run check:lint\" && NODE_ENV=production eslint ./src",
     "check:lint-fix": "echo \"Run check:lint\" && NODE_ENV=production eslint ./src --fix",
-    "check:types": "echo \"Run check:types\" && tsc --project tsconfig.json --skipLibCheck --emitDeclarationOnly false --noEmit"
+    "check:types": "echo \"Run check:types\" && pushwoosh-engine lib:check-types"
   }
 }