peixue-dev/Archive/[一次性]轮播图不显示问题诊断-2026-01-27.md

轮播图不显示问题诊断

时间：2026-01-27

问题描述

后台管理系统添加轮播图后，界面显示"请求的资源不存在"（404错误）。

当前配置检查

✅ 前端配置

• baseURL: http://localhost:8089/api (来自 .env.development)
• API路径: /banner/admin/list
• 完整URL: http://localhost:8089/api/banner/admin/list

✅ 后端配置

• Controller路径: @RequestMapping("/api/banner")
• 获取列表接口: @GetMapping("/admin/list")
• 完整路径: /api/banner/admin/list

✅ 代码检查

• BannerController: 正常
• BannerService: 正常
• BannerServiceImpl: 正常
• Banner实体类: 正常

可能的原因

1. 后端服务未启动 ⚠️

检查方法：

# 检查8089端口是否被占用
netstat -ano | findstr :8089

# 或者访问健康检查接口
curl http://localhost:8089/api/health

2. 后端端口配置不一致 ⚠️

检查文件: peidu/backend/src/main/resources/application.yml

server:
  port: 8089  # 确认端口是否为8089

3. 数据库中没有banner表 ⚠️

检查SQL：

-- 检查表是否存在
SHOW TABLES LIKE 'banner';

-- 查看表结构
DESC banner;

-- 查询数据
SELECT * FROM banner;

4. 编译错误导致后端无法启动 ⚠️

之前修复了GrowthRecordServiceImpl的编译错误，需要确认编译是否成功。

检查方法：

cd peidu/backend
mvn clean compile -DskipTests

修复步骤

步骤1：确认后端服务状态

# 进入后端目录
cd peidu/backend

# 编译项目
mvn clean compile -DskipTests

# 如果编译成功，启动服务
mvn spring-boot:run

步骤2：检查数据库

运行SQL检查脚本：Archive/[一次性]检查banner表-2026-01-27.sql

如果表不存在，需要创建：

CREATE TABLE `banner` (
  `id` bigint NOT NULL AUTO_INCREMENT COMMENT 'ID',
  `title` varchar(100) DEFAULT NULL COMMENT '标题',
  `image_url` varchar(500) NOT NULL COMMENT '图片URL',
  `link_type` varchar(20) DEFAULT 'none' COMMENT '链接类型：none-无链接，page-内部页面，url-外部链接',
  `link_url` varchar(500) DEFAULT NULL COMMENT '链接地址',
  `sort_order` int DEFAULT '0' COMMENT '排序',
  `status` tinyint DEFAULT '1' COMMENT '状态：0-禁用，1-启用',
  `start_time` datetime DEFAULT NULL COMMENT '开始时间',
  `end_time` datetime DEFAULT NULL COMMENT '结束时间',
  `create_time` datetime DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',
  `update_time` datetime DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新时间',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='轮播图表';

步骤3：添加测试数据

INSERT INTO banner (title, image_url, link_type, link_url, sort_order, status, start_time, end_time)
VALUES 
('测试轮播图1', '/static/banner/banner1.jpg', 'none', NULL, 1, 1, '2024-01-01 00:00:00', '2030-12-31 23:59:59'),
('测试轮播图2', '/static/banner/banner2.jpg', 'none', NULL, 2, 1, '2024-01-01 00:00:00', '2030-12-31 23:59:59');

步骤4：验证API

使用浏览器或Postman访问：

GET http://localhost:8089/api/banner/admin/list

预期返回：

{
  "code": 200,
  "message": "success",
  "data": [
    {
      "id": 1,
      "title": "测试轮播图1",
      "imageUrl": "/static/banner/banner1.jpg",
      ...
    }
  ]
}

步骤5：刷新前端页面

确认后端正常后，刷新后台管理系统的轮播图管理页面。

快速诊断命令

# 1. 检查后端是否运行
curl http://localhost:8089/api/health

# 2. 检查轮播图API
curl http://localhost:8089/api/banner/admin/list

# 3. 查看后端日志
# 在后端运行窗口查看是否有错误信息

预期结果

修复后应该能够：

1. ✅ 后台管理系统正常显示轮播图列表
2. ✅ 可以新增、编辑、删除轮播图
3. ✅ 小程序首页能够加载并显示轮播图

注意事项

1. 端口冲突：确保8089端口没有被其他程序占用
2. 数据库连接：确保数据库配置正确且可以连接
3. 编译错误：确保所有Java代码编译通过
4. 图片路径：轮播图的图片URL需要是可访问的路径

---

下一步操作： 请按照上述步骤逐一检查，找出具体问题所在。