SpringBoot+Vue构建宠物健康管理系统的技术实践

1. 项目概述与背景

宠物健康管理正成为现代家庭的重要需求。随着宠物经济规模突破千亿，超过60%的宠物主每月至少进行1次健康咨询。传统线下服务存在三大痛点：兽医资源分布不均、健康档案管理混乱、紧急情况响应滞后。这个基于SpringBoot+Vue的BS架构系统，正是为解决这些痛点而设计的数字化解决方案。

我在实际开发中发现，系统需要同时满足三类用户的核心诉求：

• 宠物主：随时获取专业建议、完整记录健康数据、接收用药提醒
• 兽医：高效处理咨询请求、查看完整病历、管理服务排期
• 管理员：监控系统运行、管理用户权限、分析服务数据

2. 技术架构解析

2.1 后端技术栈选型

SpringBoot 2.7.12作为核心框架，主要基于以下考量：

1. 自动配置机制减少70%的XML配置
2. 内嵌Tomcat支持快速部署（实测启动时间<3s）
3. Actuator端点提供/health、/metrics等监控指标

关键配置示例：

java复制// 启用JPA审计和缓存
@EnableCaching
@EnableJpaAuditing
@SpringBootApplication
public class PetHealthApplication {
    public static void main(String[] args) {
        SpringApplication.run(PetHealthApplication.class, args);
    }
}

2.2 前端架构设计

采用Vue3+TypeScript组合，主要优势：

• Composition API提升代码复用率
• Vite构建速度比Webpack快5-8倍
• Element Plus组件库覆盖90%的UI需求

典型页面结构：

code复制/src
  /api - 接口封装
  /components - 公共组件
  /router - 路由配置
  /stores - Pinia状态管理
  /views
    /pet - 宠物档案页
    /consult - 咨询页

3. 数据库设计与优化

3.1 核心表结构

用户表增加OAuth2登录支持：

sql复制ALTER TABLE `user` 
ADD COLUMN `auth_type` VARCHAR(20) COMMENT 'github/wechat/alipay',
ADD COLUMN `social_id` VARCHAR(100) COMMENT '第三方ID';

宠物表添加JSON字段存储动态属性：

sql复制ALTER TABLE `pet` 
ADD COLUMN `extended_props` JSON COMMENT '疫苗记录/过敏史等扩展字段';

3.2 查询优化方案

高频查询添加复合索引：

sql复制CREATE INDEX idx_consult_status ON health_consult(vet_id, consult_status);

大文本字段分表存储：

sql复制CREATE TABLE consult_detail (
  id BIGINT PRIMARY KEY,
  content LONGTEXT,
  FULLTEXT INDEX ft_content (content)
) ENGINE=InnoDB;

4. 核心功能实现

4.1 在线咨询模块

采用WebSocket实现实时通讯：

java复制@ServerEndpoint("/consult/{sessionId}")
public class ConsultEndpoint {
    @OnMessage
    public void handleMessage(Session session, String msg) {
        // 消息处理逻辑
    }
}

消息存储采用Redis+MySQL双写策略：

1. 最新50条存Redis（SortedSet结构）
2. 历史数据存MySQL
3. 每日凌晨执行数据同步

4.2 健康提醒服务

基于Quartz的定时任务配置：

java复制@Scheduled(cron = "0 0 9 * * ?")
public void sendDailyReminders() {
    // 查询当日需要提醒的记录
    // 推送微信/短信通知
}

5. 安全防护方案

5.1 认证授权体系

JWT+RBAC组合方案：

• AccessToken有效期2小时
• RefreshToken有效期7天
• 接口权限细粒度到按钮级别

安全配置示例：

java复制http.csrf().disable()
    .authorizeRequests()
    .antMatchers("/api/public/**").permitAll()
    .antMatchers("/api/vet/**").hasRole("VET")
    .anyRequest().authenticated();

5.2 数据安全措施

敏感字段加密存储：

java复制@Convert(converter = CryptoConverter.class)
private String phoneNumber;

SQL注入防护：

• 强制使用MyBatis参数绑定
• 安装SQL防火墙插件

6. 部署与运维

6.1 容器化部署

Docker Compose编排方案：

yaml复制services:
  app:
    image: pet-health:1.0
    ports:
      - "8080:8080"
    depends_on:
      - redis
      - mysql

6.2 性能监控

Prometheus+Grafana监控看板配置：

• JVM内存使用率阈值告警
• API响应时间P99监控
• 数据库连接池活跃数监控

7. 开发经验总结

7.1 典型问题解决

跨域问题处理方案：

java复制@Configuration
public class CorsConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
            .allowedOrigins("*")
            .allowedMethods("*");
    }
}

7.2 性能优化技巧

前端懒加载配置：

javascript复制const PetList = () => import('./views/PetList.vue')

后端缓存策略：

java复制@Cacheable(value = "petInfo", key = "#petId")
public Pet getPetDetail(Long petId) {
    // 数据库查询
}

8. 扩展方向建议

1. 增加AI健康诊断功能（TensorFlow.js集成）
2. 对接智能硬件获取实时体征数据
3. 开发微信小程序端扩大用户覆盖
4. 实现兽医在线问诊排班系统

这个项目完整演示了如何将SpringBoot和Vue技术栈应用于实际业务场景。我在开发过程中特别注重三个原则：用户体验优先、代码可维护性、系统扩展性。建议初学者可以从模块拆分入手，逐步实现核心功能。