做设计接单的网站响应式网站滑动
文章目录
- **方案 1：使用 ELK（Elasticsearch + Logstash + Kibana）**
- **适用场景**
- **搭建步骤**
- **1. 修改 Spring Boot 日志输出**
- **2. 创建 Docker Compose 文件**
- **3. 配置 Logstash**
- **4. 启动服务**
- **方案 2：使用 Loki + Grafana**
- **适用场景**
- **搭建步骤**
- **1. 修改 Spring Boot 日志驱动**
- **2. 配置 Grafana 数据源**
- **3. 查看日志**
- **方案 3：直接通过 Docker 日志 API + WebSocket 实时推送**
- **适用场景**
- **搭建步骤**
- **1. 创建 Spring Boot 日志接口**
- **2. 前端页面**
- **3. 访问日志页面**
- **方案对比**
- **推荐选择**
在 Spring Boot 项目运行于 Docker 容器时，若需要在页面上查看实时控制台日志，可通过以下几种方案实现。以下是每种方案的详细搭建步骤：
方案 1：使用 ELK（Elasticsearch + Logstash + Kibana）
适用场景
- 需要集中式日志管理、搜索和分析能力。
- 适合生产环境，支持多节点日志聚合。
搭建步骤
1. 修改 Spring Boot 日志输出
确保应用日志输出为 JSON 格式（便于 Logstash 解析）：
# application.properties
logging.pattern.console={"time":"%d{yyyy-MM-dd HH:mm:ss.SSS}","level":"%level","service":"${spring.application.name}","thread":"%thread","message":"%msg"}%n
2. 创建 Docker Compose 文件
docker-compose-elk.yml：
version: '3'
services:spring-boot-app:image: your-spring-boot-app:latestenvironment:- SPRING_PROFILES_ACTIVE=dockerports:- "8080:8080"logging:driver: "json-file"options:max-size: "10m"max-file: "3"elasticsearch:image: docker.elastic.co/elasticsearch/elasticsearch:8.7.0environment:- discovery.type=single-node- xpack.security.enabled=falseports:- "9200:9200"volumes:- es_data:/usr/share/elasticsearch/datalogstash:image: docker.elastic.co/logstash/logstash:8.7.0ports:- "5000:5000"volumes:- ./logstash.conf:/usr/share/logstash/pipeline/logstash.confdepends_on:- elasticsearchkibana:image: docker.elastic.co/kibana/kibana:8.7.0ports:- "5601:5601"depends_on:- elasticsearchvolumes:es_data:
3. 配置 Logstash
创建 logstash.conf：
input {tcp {port => 5000codec => json_lines}
}
output {elasticsearch {hosts => ["elasticsearch:9200"]index => "spring-logs-%{+YYYY.MM.dd}"}
}
4. 启动服务
docker-compose -f docker-compose-elk.yml up
访问 Kibana 查看日志：
http://localhost:5601
方案 2：使用 Loki + Grafana
适用场景
- 轻量级日志收集，适合云原生环境。
- 与 Prometheus 监控栈集成。
搭建步骤
1. 修改 Spring Boot 日志驱动
docker-compose.yml：
version: '3'
services:spring-boot-app:image: your-spring-boot-app:latestlogging:driver: "loki"options:loki-url: "http://loki:3100/loki/api/v1/push"loki:image: grafana/loki:2.7.0ports:- "3100:3100"grafana:image: grafana/grafana:9.5.0ports:- "3000:3000"depends_on:- loki
2. 配置 Grafana 数据源
- 访问
http://localhost:3000，登录 Grafana（默认账号admin/admin）。 - 添加 Loki 数据源：
- URL:
http://loki:3100 - 保存后，在 Explore 页面查询日志。
- URL:
3. 查看日志
在 Grafana 的 Explore 页面输入查询：
{container_name="spring-boot-app"}
方案 3：直接通过 Docker 日志 API + WebSocket 实时推送
适用场景
- 简单场景，仅需实时查看单个容器日志。
- 适合开发调试。
搭建步骤
1. 创建 Spring Boot 日志接口
@RestController
public class LogController {@GetMapping("/logs")public SseEmitter streamLogs() throws IOException {SseEmitter emitter = new SseEmitter();Process process = Runtime.getRuntime().exec("docker logs -f your-container-id");BufferedReader reader = new BufferedReader(new InputStreamReader(process.getInputStream()));new Thread(() -> {String line;try {while ((line = reader.readLine()) != null) {emitter.send(SseEmitter.event().data(line));}} catch (IOException e) {emitter.completeWithError(e);}}).start();return emitter;}
}
2. 前端页面
<!DOCTYPE html>
<html>
<body><pre id="logs"></pre><script>const eventSource = new EventSource("/logs");eventSource.onmessage = (e) => {document.getElementById("logs").innerHTML += e.data + "\n";};</script>
</body>
</html>
3. 访问日志页面
http://localhost:8080/logs-page
方案对比
| 方案 | 适用场景 | 复杂度 | 实时性 | 生产可用性 |
|---|---|---|---|---|
| ELK | 生产环境，多节点 | 高 | ✔️ | ✔️ |
| Loki+Grafana | 云原生，轻量级 | 中 | ✔️ | ✔️ |
| Docker API | 开发调试，单容器 | 低 | ✔️ | ❌ |
推荐选择
- 开发环境：直接使用 Docker API 或
docker logs -f。 - 生产环境：使用 ELK 或 Loki+Grafana，具体取决于基础设施复杂度。