cipher-logger 1.2.0 → 1.3.0

package/README.md

@@ -23,7 +23,7 @@
 
 ---
 
-**Cipher Logger** is a lightweight, production-ready HTTP logging library for Node.js. It captures every request in **Express** and **Next.js** applications. You decide exactly which fields appear in each log — required fields are always recorded, optional fields are opt-in.
+**Cipher Logger** is a lightweight, production-ready HTTP logging library for Node.js. It captures every request in **Express**, **Next.js**, **React**, **Vue**, and **Nuxt** applications. You decide exactly which fields appear in each log — required fields are always recorded, optional fields are opt-in.
 
 ## Table of Contents
 
@@ -48,11 +48,11 @@
 - **Configurable fields** — fine-grained control over optional log fields
 - **Express middleware** — records real `status` and `duration` after the response finishes
 - **Next.js middleware** — drop-in support for `middleware.ts`
-- **Zero heavy dependencies** — only `express` or `next` as optional peer dependencies
- - **Fastify middleware** — lightweight hook-compatible middleware for Fastify
- - **NestJS middleware** — Express-compatible middleware for Nest apps
- - **Hono middleware** — edge-friendly middleware for Hono apps
- - **Zero heavy dependencies** — only framework peers are optional
+- **React**, **Vue**, and **Nuxt** support — modern app stacks alongside the server frameworks
+- **Zero heavy dependencies** — only framework peers are optional
+- **Fastify middleware** — lightweight hook-compatible middleware for Fastify
+- **NestJS middleware** — Express-compatible middleware for Nest apps
+- **Hono middleware** — edge-friendly middleware for Hono apps
 - **Node.js 18+** compatible
 
 ---
@@ -78,6 +78,15 @@ npm install express
 # Next.js
 npm install next
 
+# React
+npm install react
+
+# Vue
+npm install vue
+
+# Nuxt
+npm install nuxt
+
 # Fastify
 npm install fastify
 

package/dist/index.d.mts

@@ -76,10 +76,49 @@ declare function createNestMiddleware(cipher: CipherLogger): NestMiddleware;
 type HonoMiddleware = (c: Context, next: () => Promise<void>) => Response | Promise<Response>;
 declare function createHonoMiddleware(cipher: CipherLogger): HonoMiddleware;
 
+type ReactRequest = {
+    method: string;
+    url: string;
+    headers: Headers | Record<string, string | string[] | undefined>;
+};
+type ReactResponse = {
+    status?: number;
+    end: (...args: unknown[]) => unknown;
+};
+type ReactMiddleware = (req: ReactRequest, res: ReactResponse) => void;
+declare function createReactMiddleware(cipher: CipherLogger): ReactMiddleware;
+
+type VueRequest = {
+    method: string;
+    url: string;
+    headers: Headers | Record<string, string | string[] | undefined>;
+};
+type VueResponse = {
+    status?: number;
+    end: (...args: unknown[]) => unknown;
+};
+type VueMiddleware = (req: VueRequest, res: VueResponse) => void;
+declare function createVueMiddleware(cipher: CipherLogger): VueMiddleware;
+
+type NuxtRequest = {
+    method: string;
+    url: string;
+    headers: Headers | Record<string, string | string[] | undefined>;
+};
+type NuxtResponse = {
+    status?: number;
+    end: (...args: unknown[]) => unknown;
+};
+type NuxtMiddleware = (req: NuxtRequest, res: NuxtResponse) => void;
+declare function createNuxtMiddleware(cipher: CipherLogger): NuxtMiddleware;
+
 interface CipherLogger {
     logRequest(input: RequestLogInput): RequestLog;
     express(): ExpressMiddleware;
     next(): NextMiddleware;
+    react(): ReactMiddleware;
+    vue(): VueMiddleware;
+    nuxt(): NuxtMiddleware;
     fastify(): FastifyMiddleware;
     nest(): NestMiddleware;
     hono(): HonoMiddleware;
@@ -88,4 +127,4 @@ declare function createCipherLogger(config?: CipherLoggerConfig): CipherLogger;
 
 declare const logger: Logger;
 
-export { type CipherLogger, type CipherLoggerConfig, type ExpressMiddleware, type FastifyMiddleware, type HonoMiddleware, type LogLevel, type LogMeta, Logger, type LoggerOptions, type NestMiddleware, type NextMiddleware, type OptionalRequestField, type RequestLog, type RequestLogInput, createCipherLogger, createExpressMiddleware, createFastifyMiddleware, createHonoMiddleware, createNestMiddleware, createNextMiddleware, logger, type RequestLog as request };
+export { type CipherLogger, type CipherLoggerConfig, type ExpressMiddleware, type FastifyMiddleware, type HonoMiddleware, type LogLevel, type LogMeta, Logger, type LoggerOptions, type NestMiddleware, type NextMiddleware, type NuxtMiddleware, type OptionalRequestField, type ReactMiddleware, type RequestLog, type RequestLogInput, type VueMiddleware, createCipherLogger, createExpressMiddleware, createFastifyMiddleware, createHonoMiddleware, createNestMiddleware, createNextMiddleware, createNuxtMiddleware, createReactMiddleware, createVueMiddleware, logger, type RequestLog as request };

package/dist/index.d.ts

@@ -76,10 +76,49 @@ declare function createNestMiddleware(cipher: CipherLogger): NestMiddleware;
 type HonoMiddleware = (c: Context, next: () => Promise<void>) => Response | Promise<Response>;
 declare function createHonoMiddleware(cipher: CipherLogger): HonoMiddleware;
 
+type ReactRequest = {
+    method: string;
+    url: string;
+    headers: Headers | Record<string, string | string[] | undefined>;
+};
+type ReactResponse = {
+    status?: number;
+    end: (...args: unknown[]) => unknown;
+};
+type ReactMiddleware = (req: ReactRequest, res: ReactResponse) => void;
+declare function createReactMiddleware(cipher: CipherLogger): ReactMiddleware;
+
+type VueRequest = {
+    method: string;
+    url: string;
+    headers: Headers | Record<string, string | string[] | undefined>;
+};
+type VueResponse = {
+    status?: number;
+    end: (...args: unknown[]) => unknown;
+};
+type VueMiddleware = (req: VueRequest, res: VueResponse) => void;
+declare function createVueMiddleware(cipher: CipherLogger): VueMiddleware;
+
+type NuxtRequest = {
+    method: string;
+    url: string;
+    headers: Headers | Record<string, string | string[] | undefined>;
+};
+type NuxtResponse = {
+    status?: number;
+    end: (...args: unknown[]) => unknown;
+};
+type NuxtMiddleware = (req: NuxtRequest, res: NuxtResponse) => void;
+declare function createNuxtMiddleware(cipher: CipherLogger): NuxtMiddleware;
+
 interface CipherLogger {
     logRequest(input: RequestLogInput): RequestLog;
     express(): ExpressMiddleware;
     next(): NextMiddleware;
+    react(): ReactMiddleware;
+    vue(): VueMiddleware;
+    nuxt(): NuxtMiddleware;
     fastify(): FastifyMiddleware;
     nest(): NestMiddleware;
     hono(): HonoMiddleware;
@@ -88,4 +127,4 @@ declare function createCipherLogger(config?: CipherLoggerConfig): CipherLogger;
 
 declare const logger: Logger;
 
-export { type CipherLogger, type CipherLoggerConfig, type ExpressMiddleware, type FastifyMiddleware, type HonoMiddleware, type LogLevel, type LogMeta, Logger, type LoggerOptions, type NestMiddleware, type NextMiddleware, type OptionalRequestField, type RequestLog, type RequestLogInput, createCipherLogger, createExpressMiddleware, createFastifyMiddleware, createHonoMiddleware, createNestMiddleware, createNextMiddleware, logger, type RequestLog as request };
+export { type CipherLogger, type CipherLoggerConfig, type ExpressMiddleware, type FastifyMiddleware, type HonoMiddleware, type LogLevel, type LogMeta, Logger, type LoggerOptions, type NestMiddleware, type NextMiddleware, type NuxtMiddleware, type OptionalRequestField, type ReactMiddleware, type RequestLog, type RequestLogInput, type VueMiddleware, createCipherLogger, createExpressMiddleware, createFastifyMiddleware, createHonoMiddleware, createNestMiddleware, createNextMiddleware, createNuxtMiddleware, createReactMiddleware, createVueMiddleware, logger, type RequestLog as request };

package/dist/index.js

@@ -27,6 +27,9 @@ __export(src_exports, {
   createHonoMiddleware: () => createHonoMiddleware,
   createNestMiddleware: () => createNestMiddleware,
   createNextMiddleware: () => createNextMiddleware,
+  createNuxtMiddleware: () => createNuxtMiddleware,
+  createReactMiddleware: () => createReactMiddleware,
+  createVueMiddleware: () => createVueMiddleware,
   logger: () => logger
 });
 module.exports = __toCommonJS(src_exports);
@@ -371,6 +374,132 @@ function createHonoMiddleware(cipher) {
   };
 }
 
+// src/adapters/react/middleware.ts
+function getHeader6(request, name) {
+  if (request.headers instanceof Headers) {
+    return request.headers.get(name) ?? void 0;
+  }
+  const value = request.headers[name.toLowerCase()];
+  if (Array.isArray(value)) {
+    return value[0];
+  }
+  return value ?? void 0;
+}
+function parseQuery6(url) {
+  const result = {};
+  for (const [key, value] of url.searchParams.entries()) {
+    result[key] = value;
+  }
+  return Object.keys(result).length > 0 ? result : void 0;
+}
+function createReactMiddleware(cipher) {
+  return (req, res) => {
+    const start = Date.now();
+    const originalEnd = res.end.bind(res);
+    res.end = ((...args) => {
+      const url = new URL(req.url, "http://localhost");
+      cipher.logRequest({
+        method: req.method,
+        path: url.pathname + url.search,
+        status: res.status ?? 200,
+        duration: Date.now() - start,
+        ip: getHeader6(req, "x-forwarded-for")?.split(",")[0]?.trim() ?? getHeader6(req, "x-real-ip"),
+        userAgent: getHeader6(req, "user-agent"),
+        referer: getHeader6(req, "referer"),
+        protocol: url.protocol.replace(":", ""),
+        host: getHeader6(req, "host"),
+        query: parseQuery6(url),
+        requestId: getHeader6(req, "x-request-id")
+      });
+      return originalEnd(...args);
+    });
+  };
+}
+
+// src/adapters/vue/middleware.ts
+function getHeader7(request, name) {
+  if (request.headers instanceof Headers) {
+    return request.headers.get(name) ?? void 0;
+  }
+  const value = request.headers[name.toLowerCase()];
+  if (Array.isArray(value)) {
+    return value[0];
+  }
+  return value ?? void 0;
+}
+function parseQuery7(url) {
+  const result = {};
+  for (const [key, value] of url.searchParams.entries()) {
+    result[key] = value;
+  }
+  return Object.keys(result).length > 0 ? result : void 0;
+}
+function createVueMiddleware(cipher) {
+  return (req, res) => {
+    const start = Date.now();
+    const originalEnd = res.end.bind(res);
+    res.end = ((...args) => {
+      const url = new URL(req.url, "http://localhost");
+      cipher.logRequest({
+        method: req.method,
+        path: url.pathname + url.search,
+        status: res.status ?? 200,
+        duration: Date.now() - start,
+        ip: getHeader7(req, "x-forwarded-for")?.split(",")[0]?.trim() ?? getHeader7(req, "x-real-ip"),
+        userAgent: getHeader7(req, "user-agent"),
+        referer: getHeader7(req, "referer"),
+        protocol: url.protocol.replace(":", ""),
+        host: getHeader7(req, "host"),
+        query: parseQuery7(url),
+        requestId: getHeader7(req, "x-request-id")
+      });
+      return originalEnd(...args);
+    });
+  };
+}
+
+// src/adapters/nuxt/middleware.ts
+function getHeader8(request, name) {
+  if (request.headers instanceof Headers) {
+    return request.headers.get(name) ?? void 0;
+  }
+  const value = request.headers[name.toLowerCase()];
+  if (Array.isArray(value)) {
+    return value[0];
+  }
+  return value ?? void 0;
+}
+function parseQuery8(url) {
+  const result = {};
+  for (const [key, value] of url.searchParams.entries()) {
+    result[key] = value;
+  }
+  return Object.keys(result).length > 0 ? result : void 0;
+}
+function createNuxtMiddleware(cipher) {
+  return (req, res) => {
+    const start = Date.now();
+    const originalEnd = res.end.bind(res);
+    res.end = ((...args) => {
+      const url = new URL(req.url, "http://localhost");
+      cipher.logRequest({
+        method: req.method,
+        path: url.pathname + url.search,
+        status: res.status ?? 200,
+        duration: Date.now() - start,
+        ip: getHeader8(req, "x-forwarded-for")?.split(",")[0]?.trim() ?? getHeader8(req, "x-real-ip"),
+        userAgent: getHeader8(req, "user-agent"),
+        referer: getHeader8(req, "referer"),
+        protocol: url.protocol.replace(":", ""),
+        host: getHeader8(req, "host"),
+        query: parseQuery8(url),
+        requestId: getHeader8(req, "x-request-id")
+      });
+      return originalEnd(...args);
+    });
+  };
+}
+
 // src/core/create-cipher-logger.ts
 function createCipherLogger(config = {}) {
   const fields = resolveFieldConfig(config.fields);
@@ -390,6 +519,15 @@ function createCipherLogger(config = {}) {
     next() {
       return createNextMiddleware(cipherLogger);
     },
+    react() {
+      return createReactMiddleware(cipherLogger);
+    },
+    vue() {
+      return createVueMiddleware(cipherLogger);
+    },
+    nuxt() {
+      return createNuxtMiddleware(cipherLogger);
+    },
     fastify() {
       return createFastifyMiddleware(cipherLogger);
     },
@@ -414,5 +552,8 @@ var logger = new Logger();
   createHonoMiddleware,
   createNestMiddleware,
   createNextMiddleware,
+  createNuxtMiddleware,
+  createReactMiddleware,
+  createVueMiddleware,
   logger
 });

package/dist/index.mjs

@@ -338,6 +338,132 @@ function createHonoMiddleware(cipher) {
   };
 }
 
+// src/adapters/react/middleware.ts
+function getHeader6(request, name) {
+  if (request.headers instanceof Headers) {
+    return request.headers.get(name) ?? void 0;
+  }
+  const value = request.headers[name.toLowerCase()];
+  if (Array.isArray(value)) {
+    return value[0];
+  }
+  return value ?? void 0;
+}
+function parseQuery6(url) {
+  const result = {};
+  for (const [key, value] of url.searchParams.entries()) {
+    result[key] = value;
+  }
+  return Object.keys(result).length > 0 ? result : void 0;
+}
+function createReactMiddleware(cipher) {
+  return (req, res) => {
+    const start = Date.now();
+    const originalEnd = res.end.bind(res);
+    res.end = ((...args) => {
+      const url = new URL(req.url, "http://localhost");
+      cipher.logRequest({
+        method: req.method,
+        path: url.pathname + url.search,
+        status: res.status ?? 200,
+        duration: Date.now() - start,
+        ip: getHeader6(req, "x-forwarded-for")?.split(",")[0]?.trim() ?? getHeader6(req, "x-real-ip"),
+        userAgent: getHeader6(req, "user-agent"),
+        referer: getHeader6(req, "referer"),
+        protocol: url.protocol.replace(":", ""),
+        host: getHeader6(req, "host"),
+        query: parseQuery6(url),
+        requestId: getHeader6(req, "x-request-id")
+      });
+      return originalEnd(...args);
+    });
+  };
+}
+
+// src/adapters/vue/middleware.ts
+function getHeader7(request, name) {
+  if (request.headers instanceof Headers) {
+    return request.headers.get(name) ?? void 0;
+  }
+  const value = request.headers[name.toLowerCase()];
+  if (Array.isArray(value)) {
+    return value[0];
+  }
+  return value ?? void 0;
+}
+function parseQuery7(url) {
+  const result = {};
+  for (const [key, value] of url.searchParams.entries()) {
+    result[key] = value;
+  }
+  return Object.keys(result).length > 0 ? result : void 0;
+}
+function createVueMiddleware(cipher) {
+  return (req, res) => {
+    const start = Date.now();
+    const originalEnd = res.end.bind(res);
+    res.end = ((...args) => {
+      const url = new URL(req.url, "http://localhost");
+      cipher.logRequest({
+        method: req.method,
+        path: url.pathname + url.search,
+        status: res.status ?? 200,
+        duration: Date.now() - start,
+        ip: getHeader7(req, "x-forwarded-for")?.split(",")[0]?.trim() ?? getHeader7(req, "x-real-ip"),
+        userAgent: getHeader7(req, "user-agent"),
+        referer: getHeader7(req, "referer"),
+        protocol: url.protocol.replace(":", ""),
+        host: getHeader7(req, "host"),
+        query: parseQuery7(url),
+        requestId: getHeader7(req, "x-request-id")
+      });
+      return originalEnd(...args);
+    });
+  };
+}
+
+// src/adapters/nuxt/middleware.ts
+function getHeader8(request, name) {
+  if (request.headers instanceof Headers) {
+    return request.headers.get(name) ?? void 0;
+  }
+  const value = request.headers[name.toLowerCase()];
+  if (Array.isArray(value)) {
+    return value[0];
+  }
+  return value ?? void 0;
+}
+function parseQuery8(url) {
+  const result = {};
+  for (const [key, value] of url.searchParams.entries()) {
+    result[key] = value;
+  }
+  return Object.keys(result).length > 0 ? result : void 0;
+}
+function createNuxtMiddleware(cipher) {
+  return (req, res) => {
+    const start = Date.now();
+    const originalEnd = res.end.bind(res);
+    res.end = ((...args) => {
+      const url = new URL(req.url, "http://localhost");
+      cipher.logRequest({
+        method: req.method,
+        path: url.pathname + url.search,
+        status: res.status ?? 200,
+        duration: Date.now() - start,
+        ip: getHeader8(req, "x-forwarded-for")?.split(",")[0]?.trim() ?? getHeader8(req, "x-real-ip"),
+        userAgent: getHeader8(req, "user-agent"),
+        referer: getHeader8(req, "referer"),
+        protocol: url.protocol.replace(":", ""),
+        host: getHeader8(req, "host"),
+        query: parseQuery8(url),
+        requestId: getHeader8(req, "x-request-id")
+      });
+      return originalEnd(...args);
+    });
+  };
+}
+
 // src/core/create-cipher-logger.ts
 function createCipherLogger(config = {}) {
   const fields = resolveFieldConfig(config.fields);
@@ -357,6 +483,15 @@ function createCipherLogger(config = {}) {
     next() {
       return createNextMiddleware(cipherLogger);
     },
+    react() {
+      return createReactMiddleware(cipherLogger);
+    },
+    vue() {
+      return createVueMiddleware(cipherLogger);
+    },
+    nuxt() {
+      return createNuxtMiddleware(cipherLogger);
+    },
     fastify() {
       return createFastifyMiddleware(cipherLogger);
     },
@@ -380,5 +515,8 @@ export {
   createHonoMiddleware,
   createNestMiddleware,
   createNextMiddleware,
+  createNuxtMiddleware,
+  createReactMiddleware,
+  createVueMiddleware,
   logger
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cipher-logger",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "See every request. Capture every error. Understand your application.",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -47,6 +47,12 @@
     "nextjs",
     "nextjs-logger",
     "nextjs-middleware",
+    "react",
+    "react-logger",
+    "vue",
+    "vue-logger",
+    "nuxt",
+    "nuxt-logger",
     "express",
     "express-logger",
     "fastify",
@@ -68,6 +74,9 @@
   "peerDependencies": {
     "express": ">=4",
     "next": ">=13",
+    "react": ">=18",
+    "vue": ">=3",
+    "nuxt": ">=3",
     "fastify": ">=4",
     "hono": ">=1",
     "@nestjs/common": ">=10",
@@ -80,6 +89,15 @@
     "next": {
       "optional": true
     },
+    "react": {
+      "optional": true
+    },
+    "vue": {
+      "optional": true
+    },
+    "nuxt": {
+      "optional": true
+    },
     "fastify": {
       "optional": true
     },