piral-fetch 1.4.0-beta.6355 → 1.4.1-beta.6391

package/README.md

@@ -83,6 +83,48 @@ const instance = createInstance({
 
 **Note**: `piral-fetch` plays nicely together with authentication providers such as `piral-adal`. As such authentication tokens are automatically inserted on requests to the base URL.
 
+### Middlewares
+
+`piral-fetch` allows you to configure middleware functions which are executed on each `fetch` call. Middleware functions receive the same parameters as `fetch`, plus a `next` function which calls either the next middleware or the actual `fetch` function. The following code shows an exemplary middleware which logs when requests start and finish:
+
+```ts
+const logRequests: FetchMiddleware = async (
+  path: string,
+  options: FetchOptions,
+  next: PiletFetchApiFetch,
+): Promise<FetchResponse<any>> => {
+  try {
+    console.log(`Making request to ${path}...`);
+    const response = await next(path, options);
+    console.log(`Request to ${path} returned status code ${response.code}.`);
+    return response;
+  } catch (e) {
+    console.error(`Request to ${path} threw an error: `, e);
+    throw e;
+  }
+};
+```
+
+Middlewares must be configured in the Piral instance:
+
+```ts
+const instance = createInstance({
+  plugins: [createFetchApi({
+    // important part
+    middlewares: [
+      firstMiddleware,
+      secondMiddleware,
+      thirdMiddleware,
+      logRequests,
+    ],
+    // ...other options...
+  })],
+  // ...
+});
+```
+
+Middlewares are invoked in a top-down order. In the above example, this means that `firstMiddleware` is invoked first, then `secondMiddleware`, then `thirdMiddleware`, then `logRequests` and finally the actual `fetch` function.
+
 :::
 
 ## License

package/esm/config.d.ts

@@ -1,3 +1,14 @@
+import type { FetchOptions, FetchResponse, PiletFetchApiFetch } from './types';
+export interface FetchMiddleware {
+    /**
+     * A middleware function for the fetch API.
+     * @param path The target of the fetch.
+     * @param options The options to be used.
+     * @param next A function that invokes the next middleware or the final `fetch`.
+     * @returns The promise waiting for the response to arrive.
+     */
+    (path: string, options: FetchOptions, next: PiletFetchApiFetch): Promise<FetchResponse<any>>;
+}
 export interface FetchConfig {
     /**
      * Sets the default request init settings.
@@ -9,4 +20,10 @@ export interface FetchConfig {
      * @default location.origin
      */
     base?: string;
+    /**
+     * An ordered list of middleware functions which can intercept and transform any request made via `piral-fetch`.
+     * Middleware functions are executed in a top-down order for each fetch request.
+     * @default []
+     */
+    middlewares?: Array<FetchMiddleware>;
 }

package/esm/fetch.js

@@ -2,39 +2,56 @@ const headerAccept = 'accept';
 const headerContentType = 'content-type';
 const mimeApplicationJson = 'application/json';
 export function httpFetch(config, path, options = {}) {
-    const baseInit = config.default || {};
-    const baseHeaders = baseInit.headers || {};
-    const baseUrl = config.base || location.origin;
-    const { method = 'get', body, headers = {}, cache = baseInit.cache, mode = baseInit.mode, result = 'auto', signal } = options;
-    const json = Array.isArray(body) ||
-        typeof body === 'number' ||
-        (typeof body === 'object' && body instanceof FormData === false && body instanceof Blob === false);
-    const url = new URL(path, baseUrl);
-    const init = {
-        ...baseInit,
-        method,
-        body: json ? JSON.stringify(body) : body,
-        headers: {
-            ...baseHeaders,
-            ...headers,
-        },
-        cache,
-        mode,
-        signal,
+    // fetcher makes the actual HTTP request.
+    // It is used as the last step in the upcoming middleware chain and does *not* call/require next
+    // (which is undefined in this case).
+    const fetcher = (path, options) => {
+        const baseInit = config.default || {};
+        const baseHeaders = baseInit.headers || {};
+        const baseUrl = config.base || location.origin;
+        const { method = 'get', body, headers = {}, cache = baseInit.cache, mode = baseInit.mode, result = 'auto', signal, } = options;
+        const json = Array.isArray(body) ||
+            typeof body === 'number' ||
+            (typeof body === 'object' && body instanceof FormData === false && body instanceof Blob === false);
+        const url = new URL(path, baseUrl);
+        const init = {
+            ...baseInit,
+            method,
+            body: json ? JSON.stringify(body) : body,
+            headers: {
+                ...baseHeaders,
+                ...headers,
+            },
+            cache,
+            mode,
+            signal,
+        };
+        if (json) {
+            init.headers[headerContentType] = 'application/json';
+            init.headers[headerAccept] = mimeApplicationJson;
+        }
+        return fetch(url.href, init).then((res) => {
+            const contentType = res.headers.get(headerContentType);
+            const json = result === 'json' || (result === 'auto' && !!contentType && contentType.indexOf('json') !== -1);
+            const promise = json ? res.json() : res.text();
+            return promise.then((body) => ({
+                body,
+                code: res.status,
+                text: res.statusText,
+            }));
+        });
     };
-    if (json) {
-        init.headers[headerContentType] = 'application/json';
-        init.headers[headerAccept] = mimeApplicationJson;
-    }
-    return fetch(url.href, init).then((res) => {
-        const contentType = res.headers.get(headerContentType);
-        const json = result === 'json' || (result === 'auto' && !!contentType && contentType.indexOf('json') !== -1);
-        const promise = json ? res.json() : res.text();
-        return promise.then((body) => ({
-            body,
-            code: res.status,
-            text: res.statusText,
-        }));
+    // Prepare the middleware chain. Middlewares are called in a top-down order.
+    // Every configured middleware function must receive a `next` function with the same shape
+    // as a `fetch` function. `next` invokes the next function in the chain.
+    // `fetcher` from above is the last function in the chain and always terminates it.
+    const middlewareFns = [...(config.middlewares || []), fetcher];
+    let middlewareChain;
+    middlewareChain = middlewareFns.map((middleware, i) => {
+        const next = (path, options) => middlewareChain[i + 1](path, options);
+        const invoke = (path, options) => middleware(path, options, next);
+        return invoke;
     });
+    return middlewareChain[0](path, options);
 }
 //# sourceMappingURL=fetch.js.map

package/esm/fetch.js.map

@@ -1 +1 @@
-{"version":3,"file":"fetch.js","sourceRoot":"","sources":["../src/fetch.ts"],"names":[],"mappings":"AAGA,MAAM,YAAY,GAAG,QAAQ,CAAC;AAC9B,MAAM,iBAAiB,GAAG,cAAc,CAAC;AACzC,MAAM,mBAAmB,GAAG,kBAAkB,CAAC;AAE/C,MAAM,UAAU,SAAS,CAAI,MAAmB,EAAE,IAAY,EAAE,UAAwB,EAAE;IACxF,MAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,IAAI,EAAE,CAAC;IACtC,MAAM,WAAW,GAAG,QAAQ,CAAC,OAAO,IAAI,EAAE,CAAC;IAC3C,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,IAAI,QAAQ,CAAC,MAAM,CAAC;IAC/C,MAAM,EAAE,MAAM,GAAG,KAAK,EAAE,IAAI,EAAE,OAAO,GAAG,EAAE,EAAE,KAAK,GAAG,QAAQ,CAAC,KAAK,EAAE,IAAI,GAAG,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC;IAC9H,MAAM,IAAI,GACR,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;QACnB,OAAO,IAAI,KAAK,QAAQ;QACxB,CAAC,OAAO,IAAI,KAAK,QAAQ,IAAI,IAAI,YAAY,QAAQ,KAAK,KAAK,IAAI,IAAI,YAAY,IAAI,KAAK,KAAK,CAAC,CAAC;IACrG,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;IACnC,MAAM,IAAI,GAAgB;QACxB,GAAG,QAAQ;QACX,MAAM;QACN,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,CAAE,IAAiB;QACtD,OAAO,EAAE;YACP,GAAG,WAAW;YACd,GAAG,OAAO;SACX;QACD,KAAK;QACL,IAAI;QACJ,MAAM;KACP,CAAC;IAEF,IAAI,IAAI,EAAE;QACR,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,GAAG,kBAAkB,CAAC;QACrD,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,GAAG,mBAAmB,CAAC;KAClD;IAED,OAAO,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE;QACxC,MAAM,WAAW,GAAG,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;QACvD,MAAM,IAAI,GAAG,MAAM,KAAK,MAAM,IAAI,CAAC,MAAM,KAAK,MAAM,IAAI,CAAC,CAAC,WAAW,IAAI,WAAW,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;QAC7G,MAAM,OAAO,GAAG,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;QAE/C,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YAC7B,IAAI;YACJ,IAAI,EAAE,GAAG,CAAC,MAAM;YAChB,IAAI,EAAE,GAAG,CAAC,UAAU;SACrB,CAAC,CAAC,CAAC;IACN,CAAC,CAAC,CAAC;AACL,CAAC"}
+{"version":3,"file":"fetch.js","sourceRoot":"","sources":["../src/fetch.ts"],"names":[],"mappings":"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"}

package/lib/config.d.ts

@@ -1,3 +1,14 @@
+import type { FetchOptions, FetchResponse, PiletFetchApiFetch } from './types';
+export interface FetchMiddleware {
+    /**
+     * A middleware function for the fetch API.
+     * @param path The target of the fetch.
+     * @param options The options to be used.
+     * @param next A function that invokes the next middleware or the final `fetch`.
+     * @returns The promise waiting for the response to arrive.
+     */
+    (path: string, options: FetchOptions, next: PiletFetchApiFetch): Promise<FetchResponse<any>>;
+}
 export interface FetchConfig {
     /**
      * Sets the default request init settings.
@@ -9,4 +20,10 @@ export interface FetchConfig {
      * @default location.origin
      */
     base?: string;
+    /**
+     * An ordered list of middleware functions which can intercept and transform any request made via `piral-fetch`.
+     * Middleware functions are executed in a top-down order for each fetch request.
+     * @default []
+     */
+    middlewares?: Array<FetchMiddleware>;
 }

package/lib/fetch.js

@@ -5,40 +5,57 @@ const headerAccept = 'accept';
 const headerContentType = 'content-type';
 const mimeApplicationJson = 'application/json';
 function httpFetch(config, path, options = {}) {
-    const baseInit = config.default || {};
-    const baseHeaders = baseInit.headers || {};
-    const baseUrl = config.base || location.origin;
-    const { method = 'get', body, headers = {}, cache = baseInit.cache, mode = baseInit.mode, result = 'auto', signal } = options;
-    const json = Array.isArray(body) ||
-        typeof body === 'number' ||
-        (typeof body === 'object' && body instanceof FormData === false && body instanceof Blob === false);
-    const url = new URL(path, baseUrl);
-    const init = {
-        ...baseInit,
-        method,
-        body: json ? JSON.stringify(body) : body,
-        headers: {
-            ...baseHeaders,
-            ...headers,
-        },
-        cache,
-        mode,
-        signal,
+    // fetcher makes the actual HTTP request.
+    // It is used as the last step in the upcoming middleware chain and does *not* call/require next
+    // (which is undefined in this case).
+    const fetcher = (path, options) => {
+        const baseInit = config.default || {};
+        const baseHeaders = baseInit.headers || {};
+        const baseUrl = config.base || location.origin;
+        const { method = 'get', body, headers = {}, cache = baseInit.cache, mode = baseInit.mode, result = 'auto', signal, } = options;
+        const json = Array.isArray(body) ||
+            typeof body === 'number' ||
+            (typeof body === 'object' && body instanceof FormData === false && body instanceof Blob === false);
+        const url = new URL(path, baseUrl);
+        const init = {
+            ...baseInit,
+            method,
+            body: json ? JSON.stringify(body) : body,
+            headers: {
+                ...baseHeaders,
+                ...headers,
+            },
+            cache,
+            mode,
+            signal,
+        };
+        if (json) {
+            init.headers[headerContentType] = 'application/json';
+            init.headers[headerAccept] = mimeApplicationJson;
+        }
+        return fetch(url.href, init).then((res) => {
+            const contentType = res.headers.get(headerContentType);
+            const json = result === 'json' || (result === 'auto' && !!contentType && contentType.indexOf('json') !== -1);
+            const promise = json ? res.json() : res.text();
+            return promise.then((body) => ({
+                body,
+                code: res.status,
+                text: res.statusText,
+            }));
+        });
     };
-    if (json) {
-        init.headers[headerContentType] = 'application/json';
-        init.headers[headerAccept] = mimeApplicationJson;
-    }
-    return fetch(url.href, init).then((res) => {
-        const contentType = res.headers.get(headerContentType);
-        const json = result === 'json' || (result === 'auto' && !!contentType && contentType.indexOf('json') !== -1);
-        const promise = json ? res.json() : res.text();
-        return promise.then((body) => ({
-            body,
-            code: res.status,
-            text: res.statusText,
-        }));
+    // Prepare the middleware chain. Middlewares are called in a top-down order.
+    // Every configured middleware function must receive a `next` function with the same shape
+    // as a `fetch` function. `next` invokes the next function in the chain.
+    // `fetcher` from above is the last function in the chain and always terminates it.
+    const middlewareFns = [...(config.middlewares || []), fetcher];
+    let middlewareChain;
+    middlewareChain = middlewareFns.map((middleware, i) => {
+        const next = (path, options) => middlewareChain[i + 1](path, options);
+        const invoke = (path, options) => middleware(path, options, next);
+        return invoke;
     });
+    return middlewareChain[0](path, options);
 }
 exports.httpFetch = httpFetch;
 //# sourceMappingURL=fetch.js.map

package/lib/fetch.js.map

@@ -1 +1 @@
-{"version":3,"file":"fetch.js","sourceRoot":"","sources":["../src/fetch.ts"],"names":[],"mappings":";;;AAGA,MAAM,YAAY,GAAG,QAAQ,CAAC;AAC9B,MAAM,iBAAiB,GAAG,cAAc,CAAC;AACzC,MAAM,mBAAmB,GAAG,kBAAkB,CAAC;AAE/C,SAAgB,SAAS,CAAI,MAAmB,EAAE,IAAY,EAAE,UAAwB,EAAE;IACxF,MAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,IAAI,EAAE,CAAC;IACtC,MAAM,WAAW,GAAG,QAAQ,CAAC,OAAO,IAAI,EAAE,CAAC;IAC3C,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,IAAI,QAAQ,CAAC,MAAM,CAAC;IAC/C,MAAM,EAAE,MAAM,GAAG,KAAK,EAAE,IAAI,EAAE,OAAO,GAAG,EAAE,EAAE,KAAK,GAAG,QAAQ,CAAC,KAAK,EAAE,IAAI,GAAG,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC;IAC9H,MAAM,IAAI,GACR,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;QACnB,OAAO,IAAI,KAAK,QAAQ;QACxB,CAAC,OAAO,IAAI,KAAK,QAAQ,IAAI,IAAI,YAAY,QAAQ,KAAK,KAAK,IAAI,IAAI,YAAY,IAAI,KAAK,KAAK,CAAC,CAAC;IACrG,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;IACnC,MAAM,IAAI,GAAgB;QACxB,GAAG,QAAQ;QACX,MAAM;QACN,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,CAAE,IAAiB;QACtD,OAAO,EAAE;YACP,GAAG,WAAW;YACd,GAAG,OAAO;SACX;QACD,KAAK;QACL,IAAI;QACJ,MAAM;KACP,CAAC;IAEF,IAAI,IAAI,EAAE;QACR,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,GAAG,kBAAkB,CAAC;QACrD,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,GAAG,mBAAmB,CAAC;KAClD;IAED,OAAO,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE;QACxC,MAAM,WAAW,GAAG,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;QACvD,MAAM,IAAI,GAAG,MAAM,KAAK,MAAM,IAAI,CAAC,MAAM,KAAK,MAAM,IAAI,CAAC,CAAC,WAAW,IAAI,WAAW,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;QAC7G,MAAM,OAAO,GAAG,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;QAE/C,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YAC7B,IAAI;YACJ,IAAI,EAAE,GAAG,CAAC,MAAM;YAChB,IAAI,EAAE,GAAG,CAAC,UAAU;SACrB,CAAC,CAAC,CAAC;IACN,CAAC,CAAC,CAAC;AACL,CAAC;AAvCD,8BAuCC"}
+{"version":3,"file":"fetch.js","sourceRoot":"","sources":["../src/fetch.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "piral-fetch",
-  "version": "1.4.0-beta.6355",
+  "version": "1.4.1-beta.6391",
   "description": "Plugin for standardizing fetch in Piral.",
   "keywords": [
     "piral",
@@ -65,8 +65,8 @@
     "@types/express": "^4.11.1",
     "cors": "^2.8.5",
     "express": "^4.17.1",
-    "piral-core": "1.4.0-beta.6355",
+    "piral-core": "1.4.1-beta.6391",
     "whatwg-fetch": "^3.0.0"
   },
-  "gitHead": "4ee547e3b136e8f82ab4a4e90b1fee23d47c05e8"
+  "gitHead": "a486c7752bb63d5f00f41d6660d60846b3f66f33"
 }

package/piral-fetch.min.js

@@ -1 +1 @@
-var piralFetch=(()=>{var y=Object.defineProperty;var j=e=>y(e,"__esModule",{value:!0});var A=(e,s)=>{j(e);for(var r in s)y(e,r,{get:s[r],enumerable:!0})};var R={};A(R,{createFetchApi:()=>O,httpFetch:()=>m});var T="accept",g="content-type",C="application/json";function m(e,s,r={}){let o=e.default||{},a=o.headers||{},h=e.base||location.origin,{method:n="get",body:t,headers:p={},cache:c=o.cache,mode:F=o.mode,result:d="auto",signal:P}=r,u=Array.isArray(t)||typeof t=="number"||typeof t=="object"&&!(t instanceof FormData)&&!(t instanceof Blob),b=new URL(s,h),f={...o,method:n,body:u?JSON.stringify(t):t,headers:{...a,...p},cache:c,mode:F,signal:P};return u&&(f.headers[g]="application/json",f.headers[T]=C),fetch(b.href,f).then(i=>{let l=i.headers.get(g);return(d==="json"||d==="auto"&&!!l&&l.indexOf("json")!==-1?i.json():i.text()).then(x=>({body:x,code:i.status,text:i.statusText}))})}function O(e={}){return s=>({fetch(r,o={}){let a=o.headers||{},h=[];return s.emit("before-fetch",{headers:a,method:o.method||"GET",target:r,setHeaders(n){n&&h.push(n)}}),Promise.all(h).then(n=>{let t=n.reduce((p,c)=>typeof c=="object"&&c?{...p,...c}:p,a);return{...o,headers:t}}).then(n=>m(e,r,n))}})}return R;})();
+var piralFetch=(()=>{var P=Object.defineProperty;var O=e=>P(e,"__esModule",{value:!0});var R=(e,c)=>{O(e);for(var n in c)P(e,n,{get:c[n],enumerable:!0})};var v={};R(v,{createFetchApi:()=>k,httpFetch:()=>u});var H="accept",A="content-type",I="application/json";function u(e,c,n={}){let a=(t,h)=>{let o=e.default||{},s=o.headers||{},p=e.base||location.origin,{method:f="get",body:r,headers:x={},cache:b=o.cache,mode:j=o.mode,result:F="auto",signal:T}=h,y=Array.isArray(r)||typeof r=="number"||typeof r=="object"&&!(r instanceof FormData)&&!(r instanceof Blob),w=new URL(t,p),l={...o,method:f,body:y?JSON.stringify(r):r,headers:{...s,...x},cache:b,mode:j,signal:T};return y&&(l.headers[A]="application/json",l.headers[H]=I),fetch(w.href,l).then(m=>{let g=m.headers.get(A);return(F==="json"||F==="auto"&&!!g&&g.indexOf("json")!==-1?m.json():m.text()).then(C=>({body:C,code:m.status,text:m.statusText}))})},d=[...e.middlewares||[],a],i;return i=d.map((t,h)=>{let o=(p,f)=>i[h+1](p,f);return(p,f)=>t(p,f,o)}),i[0](c,n)}function k(e={}){return c=>({fetch(n,a={}){let d=a.headers||{},i=[];return c.emit("before-fetch",{headers:d,method:a.method||"GET",target:n,setHeaders(t){t&&i.push(t)}}),Promise.all(i).then(t=>{let h=t.reduce((o,s)=>typeof s=="object"&&s?{...o,...s}:o,d);return{...a,headers:h}}).then(t=>u(e,n,t))}})}return v;})();

package/src/config.ts

@@ -1,3 +1,16 @@
+import type { FetchOptions, FetchResponse, PiletFetchApiFetch } from './types';
+
+export interface FetchMiddleware {
+  /**
+   * A middleware function for the fetch API.
+   * @param path The target of the fetch.
+   * @param options The options to be used.
+   * @param next A function that invokes the next middleware or the final `fetch`.
+   * @returns The promise waiting for the response to arrive.
+   */
+  (path: string, options: FetchOptions, next: PiletFetchApiFetch): Promise<FetchResponse<any>>;
+}
+
 export interface FetchConfig {
   /**
    * Sets the default request init settings.
@@ -9,4 +22,10 @@ export interface FetchConfig {
    * @default location.origin
    */
   base?: string;
+  /**
+   * An ordered list of middleware functions which can intercept and transform any request made via `piral-fetch`.
+   * Middleware functions are executed in a top-down order for each fetch request.
+   * @default []
+   */
+  middlewares?: Array<FetchMiddleware>;
 }

package/src/create.test.ts

@@ -83,4 +83,48 @@ describe('Create fetch API Module', () => {
     const result = response.body;
     expect(result.substr(0, 5)).toBe(`<?xml`);
   });
+
+  it('invokes configured middleware function and calls API', async () => {
+    const context = { emit: vitest.fn() } as any;
+    const middleware = vitest.fn((path, options, next) => next(path, options));
+    const { fetch } = createFetchApi({
+      base: `http://localhost:${port}`,
+      middlewares: [middleware],
+    })(context) as any;
+    const response = await fetch('json');
+    const result = response.body;
+    expect(Array.isArray(result)).toBeTruthy();
+    expect(result.length).toBe(10);
+    expect(result[0]).toBe(1);
+    expect(middleware).toHaveBeenCalledOnce();
+  });
+
+  it('invokes middleware functions in top-down order', async () => {
+    const context = { emit: vitest.fn() } as any;
+    const invocationOrder: Array<number> = [];
+    const createMiddleware = (myPosition: number) => (path, options, next) => {
+      invocationOrder.push(myPosition);
+      return next(path, options);
+    };
+    const { fetch } = createFetchApi({
+      base: `http://localhost:${port}`,
+      middlewares: [createMiddleware(1), createMiddleware(2), createMiddleware(3)],
+    })(context) as any;
+    await fetch('json');
+    expect(invocationOrder).toEqual([1, 2, 3]);
+  });
+
+  it('allows middleware functions to terminate middleware chain', async () => {
+    const context = { emit: vitest.fn() } as any;
+    const expectedResponse = { code: 200, body: 'Terminated by middleware', text: 'Terminated by middleware' };
+    const middleware = () => Promise.resolve(expectedResponse);
+    const { fetch } = createFetchApi({
+      base: `http://localhost:${port}`,
+      middlewares: [middleware],
+    })(context) as any;
+    const globalFetch = vitest.spyOn(global, 'fetch');
+    const response = await fetch('json');
+    expect(response).toBe(expectedResponse);
+    expect(globalFetch).not.toHaveBeenCalled();
+  });
 });

package/src/fetch.ts

@@ -1,47 +1,74 @@
-import { FetchConfig } from './config';
-import { FetchOptions, FetchResponse } from './types';
+import { FetchConfig, FetchMiddleware } from './config';
+import { FetchOptions, FetchResponse, PiletFetchApiFetch } from './types';
 
 const headerAccept = 'accept';
 const headerContentType = 'content-type';
 const mimeApplicationJson = 'application/json';
 
 export function httpFetch<T>(config: FetchConfig, path: string, options: FetchOptions = {}): Promise<FetchResponse<T>> {
-  const baseInit = config.default || {};
-  const baseHeaders = baseInit.headers || {};
-  const baseUrl = config.base || location.origin;
-  const { method = 'get', body, headers = {}, cache = baseInit.cache, mode = baseInit.mode, result = 'auto', signal } = options;
-  const json =
-    Array.isArray(body) ||
-    typeof body === 'number' ||
-    (typeof body === 'object' && body instanceof FormData === false && body instanceof Blob === false);
-  const url = new URL(path, baseUrl);
-  const init: RequestInit = {
-    ...baseInit,
-    method,
-    body: json ? JSON.stringify(body) : (body as BodyInit),
-    headers: {
-      ...baseHeaders,
-      ...headers,
-    },
-    cache,
-    mode,
-    signal,
-  };
+  // fetcher makes the actual HTTP request.
+  // It is used as the last step in the upcoming middleware chain and does *not* call/require next
+  // (which is undefined in this case).
+  const fetcher: FetchMiddleware = (path, options) => {
+    const baseInit = config.default || {};
+    const baseHeaders = baseInit.headers || {};
+    const baseUrl = config.base || location.origin;
+    const {
+      method = 'get',
+      body,
+      headers = {},
+      cache = baseInit.cache,
+      mode = baseInit.mode,
+      result = 'auto',
+      signal,
+    } = options;
+    const json =
+      Array.isArray(body) ||
+      typeof body === 'number' ||
+      (typeof body === 'object' && body instanceof FormData === false && body instanceof Blob === false);
+    const url = new URL(path, baseUrl);
+    const init: RequestInit = {
+      ...baseInit,
+      method,
+      body: json ? JSON.stringify(body) : (body as BodyInit),
+      headers: {
+        ...baseHeaders,
+        ...headers,
+      },
+      cache,
+      mode,
+      signal,
+    };
 
-  if (json) {
-    init.headers[headerContentType] = 'application/json';
-    init.headers[headerAccept] = mimeApplicationJson;
-  }
+    if (json) {
+      init.headers[headerContentType] = 'application/json';
+      init.headers[headerAccept] = mimeApplicationJson;
+    }
 
-  return fetch(url.href, init).then((res) => {
-    const contentType = res.headers.get(headerContentType);
-    const json = result === 'json' || (result === 'auto' && !!contentType && contentType.indexOf('json') !== -1);
-    const promise = json ? res.json() : res.text();
+    return fetch(url.href, init).then((res) => {
+      const contentType = res.headers.get(headerContentType);
+      const json = result === 'json' || (result === 'auto' && !!contentType && contentType.indexOf('json') !== -1);
+      const promise = json ? res.json() : res.text();
 
-    return promise.then((body) => ({
-      body,
-      code: res.status,
-      text: res.statusText,
-    }));
+      return promise.then((body) => ({
+        body,
+        code: res.status,
+        text: res.statusText,
+      }));
+    });
+  };
+
+  // Prepare the middleware chain. Middlewares are called in a top-down order.
+  // Every configured middleware function must receive a `next` function with the same shape
+  // as a `fetch` function. `next` invokes the next function in the chain.
+  // `fetcher` from above is the last function in the chain and always terminates it.
+  const middlewareFns = [...(config.middlewares || []), fetcher];
+  let middlewareChain: Array<PiletFetchApiFetch>;
+  middlewareChain = middlewareFns.map((middleware, i) => {
+    const next: PiletFetchApiFetch = (path, options) => middlewareChain[i + 1](path, options);
+    const invoke: PiletFetchApiFetch = (path, options) => middleware(path, options, next);
+    return invoke;
   });
+
+  return middlewareChain[0](path, options);
 }