# log-analyzer

**Repository Path**: null_743_7435/ali-log-analyzer

## Basic Information

- **Project Name**: log-analyzer
- **Description**: 日志分析系统（阿里云日志服务本地分析）
- **Primary Language**: Unknown
- **License**: MulanPSL-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-11-25
- **Last Updated**: 2025-11-25

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 日志分析系统（阿里云日志服务本地分析）

该项目用于在本地浏览器中对从阿里云日志服务导出的日志进行解析、汇总与可视化分析。支持上传单个日志文件或压缩包（RAR），并提供全文检索、趋势图、状态码分布、API 调用排名等功能。

## 功能特性
- 格式支持：JSON 数组、JSONL（逐行 JSON）、RAR 压缩包（含无后缀文本文件）
- 指标汇总：总请求数、成功率、错误数、平均延迟
- 可视化：请求趋势（分钟粒度）、状态码分布、Top 10 API 调用次数
- 搜索：表格支持全文检索（RequestID、API、Path、Method、IP、状态码、插件字段等）
- 复制：API 排名支持复制接口名称（柱条点击或列表按钮）

## 环境要求
- Node.js ≥ 16（建议 16 或 18），npm ≥ 8

## 快速开始（开发）
1. 安装依赖：
   ```bash
   npm install
   ```
2. 启动开发服务器：
   ```bash
   npm run dev
   ```
3. 打开浏览器访问本地地址（终端输出中的 `Local` 链接，例如 `http://127.0.0.1:5173/`）。

## 构建与部署（生产）
1. 构建生产包：
   ```bash
   npm run build
   ```
   构建结果位于 `dist/` 目录。
2. 本地预览：
   ```bash
   npm run preview
   ```
3. 部署方式：将 `dist/` 目录部署到任意静态站点（如 Nginx/Apache/IIS/OSS 静态托管等）。该应用为纯前端，无需后端即可在浏览器中离线分析。

## 使用说明
1. 在页面“导入日志”模块中，选择上传：
   - 单个日志文件（`.json/.log/.txt`），或
   - 压缩包（`.rar`），其中可包含多份日志文件，支持无后缀文本。
2. 上传后自动解析，页面将展示：
   - 指标汇总卡片
   - 趋势图、状态码分布、Top 10 API
   - 日志详情表格（可全文搜索、分页跳转到指定页）
3. Top 10 API 模块：可点击柱条或列表“复制”按钮，复制完整接口名。

## 与阿里云日志服务的配合
- 在阿里云日志服务控制台中，选择需要的查询范围并导出结果为 JSON 或 JSONL。
- 如果有多个导出文件，可打包为 `.rar` 后上传；系统会自动解压并合并分析。
- 字段映射（示例）：
  - `__time__`（或 `time`/`timestamp`）：Unix 时间戳（秒）
  - `requestId`：请求唯一标识
  - `apiName`：接口名称
  - `httpMethod`：HTTP 方法
  - `statusCode`：HTTP 状态码
  - `totalLatency` / `serviceLatency`：延迟（毫秒）
  - `clientIp`：客户端 IP
  - `errorCode`：业务错误码（`OK` 表示成功）
  - `plugin`：插件字段，若为字符串形式的 JSON，会被自动解析
- 如果你的导出字段名称不同，可在 `src/utils/logParser.js` 的 `normalizeLog` 中调整映射逻辑。

## 注意事项
- 编码：默认按 UTF-8 解码；若日志为其他编码（如 GBK），请先转换为 UTF-8。
- 大文件：浏览器内存有限，建议分批导出/解析；RAR 解压在内存中进行，压缩包与解压内容都会占用内存。
- 安全：项目不上传任何数据到服务端，完全在本地浏览器内完成分析。

## 目录结构简述
- `src/components/LogUploader.jsx`：上传/解压/批量传递
- `src/utils/logParser.js`：日志解析与指标计算
- `src/components/Charts.jsx`：可视化图表与复制交互
- `src/components/SummaryCards.jsx`：指标卡片
- `src/components/LogTable.jsx`：表格展示、全文检索与分页跳转
- `src/App.jsx`：应用入口与数据串联

## 常用命令
- 启动开发：`npm run dev`
- 构建生产：`npm run build`
- 本地预览：`npm run preview`
- 代码检查：`npm run lint`