1. 项目背景与核心需求作为一名长期被日程管理问题困扰的职场人我深刻体会到纸质记事本和手机自带日历的局限性。去年团队协作时因为错过一个重要会议节点直接导致项目延期这件事促使我下定决心开发一个专属的日程管理工具。经过三个月的开发迭代这个基于微信小程序的个人日程管理系统终于成型现在把完整开发过程分享给大家。这个系统的核心解决三个痛点多场景日程整合将工作会议、私人约会、纪念日等分散记录在不同平台的内容统一管理智能提醒体系通过倒数日计算和微信服务通知避免重要事项遗漏轻量化协同支持日程共享功能满足简单的团队协作需求技术选型上前端采用微信小程序保证使用便捷性后端使用SSM框架搭建RESTful API数据库选用MySQL 8.0。这种组合既保证了开发效率又能应对初期用户量增长。2. 系统架构设计2.1 技术栈全景图整个系统采用典型的三层架构微信小程序端表现层 ↓ Java后端服务业务逻辑层 ↓ MySQL数据库数据持久层2.1.1 前端技术方案小程序基础框架使用微信原生WXMLWXSSJS开发放弃uniapp等跨平台方案确保最佳性能组件库选择采用Vant Weapp组件库特别其日历组件二次开发后作为核心展示界面状态管理对于跨页面共享的日程数据使用小程序自带的globalData机制2.1.2 后端技术方案框架组合Spring 5.2 Spring MVC MyBatis 3.5SSM安全控制JWT令牌实现接口鉴权配合微信登录的openid作为用户唯一标识API设计遵循RESTful规范所有接口返回统一JSON格式{ code: 200, data: {}, message: success }2.1.3 数据库设计选择MySQL 8.0主要考虑事务完整性要求不高不需要Oracle级别的特性JSON字段支持良好便于存储日程的扩展属性开发环境可免费使用云数据库成本可控2.2 核心功能模块系统功能划分为六大模块通过UML用例图展示主要功能点用户管理 ├─ 微信一键登录 ├─ 个人信息维护 日程管理 ├─ 日程CRUD ├─ 日历视图展示 ├─ 智能提醒设置 工作日程 ├─ 会议管理 ├─ 任务分解 ├─ 进度追踪 重要日管理 ├─ 纪念日记录 ├─ 倒数日计算 ├─ 循环事件设置 数据统计 ├─ 日程完成率 ├─ 时间分布热力图 系统管理 ├─ 用户管理 ├─ 数据备份3. 数据库详细设计3.1 表结构优化实践原始设计中有较多冗余字段经过第三范式优化后核心表减少到7张3.1.1 用户表sys_userCREATE TABLE sys_user ( id bigint NOT NULL AUTO_INCREMENT, openid varchar(32) NOT NULL COMMENT 微信openid, nickname varchar(50) DEFAULT NULL, avatar varchar(255) DEFAULT NULL, mobile varchar(20) DEFAULT NULL, create_time datetime NOT NULL DEFAULT CURRENT_TIMESTAMP, PRIMARY KEY (id), UNIQUE KEY idx_openid (openid) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4;3.1.2 日程主表scheduleCREATE TABLE schedule ( id bigint NOT NULL AUTO_INCREMENT, user_id bigint NOT NULL, title varchar(100) NOT NULL, content text, schedule_type tinyint NOT NULL COMMENT 1-工作 2-生活 3-纪念日, start_time datetime NOT NULL, end_time datetime DEFAULT NULL, location varchar(255) DEFAULT NULL, remind_type tinyint DEFAULT 1 COMMENT 1-不提醒 2-开始时 3-提前5分钟, repeat_mode varchar(20) DEFAULT NULL COMMENT daily/weekly/monthly, status tinyint DEFAULT 0 COMMENT 0-未开始 1-已完成, create_time datetime NOT NULL DEFAULT CURRENT_TIMESTAMP, PRIMARY KEY (id), KEY idx_user_time (user_id,start_time) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4;3.1.3 共享关系表schedule_shareCREATE TABLE schedule_share ( id bigint NOT NULL AUTO_INCREMENT, schedule_id bigint NOT NULL, from_user bigint NOT NULL, to_user bigint NOT NULL, permission tinyint DEFAULT 1 COMMENT 1-查看 2-编辑, create_time datetime NOT NULL DEFAULT CURRENT_TIMESTAMP, PRIMARY KEY (id), UNIQUE KEY uk_share (schedule_id,to_user) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4;3.2 索引优化方案针对查询场景建立复合索引用户日程查询(user_id, start_time)共享日程查询(to_user, schedule_id)时间范围查询(schedule_type, start_time)注意避免在频繁更新的字段上建立索引如status字段。实际测试发现对status建索引反而使写入性能下降30%4. 后端核心实现4.1 微信登录流程采用官方推荐的code换session方案小程序端获取code → 后端用codeappidsecret请求微信接口 → 获取session_key和openid → 生成自定义登录态 → 返回token给小程序关键代码实现RestController RequestMapping(/auth) public class AuthController { Value(${wx.appid}) private String appId; Value(${wx.secret}) private String secret; PostMapping(/login) public Result login(RequestParam String code) { // 构造请求URL String url https://api.weixin.qq.com/sns/jscode2session ?appid appId secret secret js_code code grant_typeauthorization_code; // 发送HTTP请求 String response restTemplate.getForObject(url, String.class); JSONObject json JSON.parseObject(response); // 处理异常情况 if(json.containsKey(errcode)) { return Result.error(json.getIntValue(errcode), json.getString(errmsg)); } // 获取openid和session_key String openid json.getString(openid); String sessionKey json.getString(session_key); // 查询或创建用户 User user userService.getOrCreate(openid); // 生成JWT令牌 String token JwtUtil.generateToken(user.getId()); return Result.success(token); } }4.2 日程提醒实现采用定时任务微信模板消息方案使用Spring Scheduled每5分钟扫描即将开始的日程通过微信订阅消息发送提醒定时任务配置Configuration EnableScheduling public class ScheduleConfig { Autowired private RemindService remindService; Scheduled(cron 0 */5 * * * ?) public void checkReminders() { // 查询5分钟内开始的日程 ListSchedule schedules scheduleMapper.selectNeedRemind( LocalDateTime.now(), LocalDateTime.now().plusMinutes(5) ); // 发送微信提醒 schedules.forEach(schedule - { remindService.sendWechatRemind(schedule); }); } }微信模板消息发送public void sendWechatRemind(Schedule schedule) { // 获取access_token String accessToken wechatService.getAccessToken(); // 构造请求数据 JSONObject data new JSONObject(); data.put(touser, schedule.getUser().getOpenid()); data.put(template_id, TEMPLATE_ID); data.put(page, /pages/detail?id schedule.getId()); JSONObject content new JSONObject(); content.put(thing1, new JSONObject().put(value, schedule.getTitle())); content.put(time2, new JSONObject().put(value, schedule.getStartTime().format(DateTimeFormatter.ofPattern(yyyy-MM-dd HH:mm)))); data.put(data, content); // 发送请求 restTemplate.postForObject( https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token accessToken, data, String.class ); }5. 小程序前端开发5.1 核心页面实现5.1.1 日历视图页采用自定义组件实现月视图周视图切换view classcalendar-container view classheader view classarrow bindtapprevMonth◀/view view classtitle{{year}}年{{month}}月/view view classarrow bindtapnextMonth▶/view /view view classweekdays view wx:for{{[日,一,二,三,四,五,六]}} wx:key*this{{item}}/view /view view classdays view wx:for{{days}} wx:keydate classday {{item.isToday ? today : }} {{item.isCurrentMonth ? : other-month}} bindtapselectDay >Page({ data: { schedule: null, loading: true }, onLoad(options) { const id options.id; wx.request({ url: https://api.yourdomain.com/schedules/${id}, header: { Authorization: Bearer ${getApp().globalData.token} }, success: (res) { if(res.data.code 200) { this.setData({ schedule: res.data.data, loading: false }); } } }); }, handleEdit() { wx.navigateTo({ url: /pages/edit/index?id${this.data.schedule.id} }); } });5.2 性能优化实践图片懒加载对日程封面图使用lazy-load属性数据分页日程列表实现上拉加载更多缓存策略对静态数据使用wx.setStorage缓存请求合并同页面多个接口合并为批量请求// 分页加载示例 let currentPage 1; function loadMore() { wx.showLoading({title: 加载中}); wx.request({ url: https://api.yourdomain.com/schedules, data: { page: currentPage, size: 10 }, success: (res) { if(res.data.data.length 0) { this.setData({ list: [...this.data.list, ...res.data.data] }); currentPage; } else { wx.showToast({title: 没有更多了, icon: none}); } }, complete: () { wx.hideLoading(); } }); }6. 部署与运维6.1 服务器环境推荐最低配置腾讯云轻量应用服务器2核CPU / 4GB内存CentOS 7.6MySQL 8.0JDK 116.2 部署流程后端部署# 打包 mvn clean package -DskipTests # 上传jar包 scp target/schedule-app.jar userserver:/app/ # 启动服务 nohup java -jar -Dspring.profiles.activeprod /app/schedule-app.jar /app/logs/app.log 21 小程序部署开发版本 → 体验版 → 提交审核 → 发布线上6.3 监控方案基础监控配置Spring Boot Actuator暴露健康检查接口Prometheus Grafana监控JVM指标微信小程序错误日志接入Sentry7. 踩坑经验总结微信登录session_key泄露问题错误做法将session_key传到前端正确方案session_key只保存在服务端通过token维持会话MySQL时区问题现象存储的时间比实际少8小时解决jdbc连接串添加serverTimezoneAsia/Shanghai小程序图片上传限制单个文件不能超过10MB解决方案超过2MB的图片先压缩再上传订阅消息发送失败常见原因用户未授权或模板ID错误调试技巧先在小程序端调用wx.requestSubscribeMessage测试日历组件性能优化初始方案全量渲染当月数据导致卡顿优化后按需加载可见区域数据这个项目从设计到上线共迭代了4个版本核心体会是对于工具类小程序一定要克制功能膨胀的冲动把核心体验做到极致。目前系统日活稳定在500后续计划增加Web端和桌面提醒功能。
