Highly ambitious ATProtocol AppView service and sdks
use std/fmt for logger colors
+45
-47
+45
-47
frontend/src/lib/request_logger.ts
+45
-47
frontend/src/lib/request_logger.ts
···
1
1
// Request logging middleware for the frontend server
2
-
3
-
// ANSI color codes
4
-
const colors = {
5
-
reset: "\x1b[0m",
6
-
bright: "\x1b[1m",
7
-
dim: "\x1b[2m",
8
-
red: "\x1b[31m",
9
-
green: "\x1b[32m",
10
-
yellow: "\x1b[33m",
11
-
blue: "\x1b[34m",
12
-
magenta: "\x1b[35m",
13
-
cyan: "\x1b[36m",
14
-
gray: "\x1b[90m",
15
-
};
2
+
import {
3
+
red,
4
+
green,
5
+
yellow,
6
+
blue,
7
+
magenta,
8
+
cyan,
9
+
gray,
10
+
bold,
11
+
dim,
12
+
} from "@std/fmt/colors";
16
13
17
-
function getStatusColor(status: number): string {
18
-
if (status >= 500) return colors.red;
19
-
if (status >= 400) return colors.yellow;
20
-
if (status >= 300) return colors.cyan;
21
-
if (status >= 200) return colors.green;
22
-
return colors.gray;
14
+
function getStatusColor(status: number): (text: string) => string {
15
+
if (status >= 500) return red;
16
+
if (status >= 400) return yellow;
17
+
if (status >= 300) return cyan;
18
+
if (status >= 200) return green;
19
+
return gray;
23
20
}
24
21
25
-
function getMethodColor(method: string): string {
22
+
function getMethodColor(method: string): (text: string) => string {
26
23
switch (method) {
27
24
case "GET":
28
-
return colors.blue;
25
+
return blue;
29
26
case "POST":
30
-
return colors.green;
27
+
return green;
31
28
case "PUT":
32
-
return colors.yellow;
29
+
return yellow;
33
30
case "DELETE":
34
-
return colors.red;
31
+
return red;
35
32
case "PATCH":
36
-
return colors.magenta;
33
+
return magenta;
37
34
default:
38
-
return colors.gray;
35
+
return gray;
39
36
}
40
37
}
41
38
42
39
export function logRequest(
43
40
req: Request,
44
41
start: number,
45
-
response: Response,
42
+
response: Response
46
43
): void {
47
44
const duration = Date.now() - start;
48
45
const url = new URL(req.url);
···
51
48
const userAgent = req.headers.get("user-agent") || "-";
52
49
const referer = req.headers.get("referer") || "-";
53
50
54
-
const methodColored = `${getMethodColor(method)}${method}${colors.reset}`;
55
-
const statusColored = `${getStatusColor(status)}${status}${colors.reset}`;
56
-
const pathColored =
57
-
`${colors.bright}${url.pathname}${url.search}${colors.reset}`;
58
-
const durationColored = duration > 1000
59
-
? `${colors.red}${duration}ms${colors.reset}`
60
-
: duration > 500
61
-
? `${colors.yellow}${duration}ms${colors.reset}`
62
-
: `${colors.dim}${duration}ms${colors.reset}`;
51
+
const methodColored = getMethodColor(method)(method);
52
+
const statusColored = getStatusColor(status)(status.toString());
53
+
const pathColored = bold(`${url.pathname}${url.search}`);
54
+
const durationColored =
55
+
duration > 1000
56
+
? red(`${duration}ms`)
57
+
: duration > 500
58
+
? yellow(`${duration}ms`)
59
+
: dim(`${duration}ms`);
63
60
64
61
console.log(
65
-
`${methodColored} ${pathColored} ${statusColored} ${durationColored} ${colors.gray}- ${userAgent} - ${referer}${colors.reset}`,
62
+
`${methodColored} ${pathColored} ${statusColored} ${durationColored} ${gray(
63
+
`- ${userAgent} - ${referer}`
64
+
)}`
66
65
);
67
66
}
68
67
69
68
export function createLoggingHandler(
70
-
handler: (req: Request) => Response | Promise<Response>,
69
+
handler: (req: Request) => Response | Promise<Response>
71
70
) {
72
71
return async function loggingHandler(req: Request): Promise<Response> {
73
72
const start = Date.now();
···
80
79
const duration = Date.now() - start;
81
80
const url = new URL(req.url);
82
81
const message = error instanceof Error ? error.message : String(error);
83
-
const methodColored = `${
84
-
getMethodColor(req.method)
85
-
}${req.method}${colors.reset}`;
86
-
const pathColored =
87
-
`${colors.bright}${url.pathname}${url.search}${colors.reset}`;
88
-
const errorColored = `${colors.red}ERROR${colors.reset}`;
89
-
const durationColored = `${colors.red}${duration}ms${colors.reset}`;
82
+
const methodColored = getMethodColor(req.method)(req.method);
83
+
const pathColored = bold(`${url.pathname}${url.search}`);
84
+
const errorColored = red("ERROR");
85
+
const durationColored = red(`${duration}ms`);
90
86
91
87
console.error(
92
-
`${methodColored} ${pathColored} ${errorColored} ${durationColored} ${colors.red}- ${message}${colors.reset}`,
88
+
`${methodColored} ${pathColored} ${errorColored} ${durationColored} ${red(
89
+
`- ${message}`
90
+
)}`
93
91
);
94
92
95
93
// Return a generic 500 error