1. 项目概述与核心价值
演唱会售票系统是连接演出主办方与观众的关键数字化桥梁。这个基于Java技术栈的全栈解决方案,通过SpringBoot/SSM后端+Vue前端+uniapp多端的组合架构,实现了从票务管理、在线选座到移动端购票的完整闭环。我在实际票务系统开发中发现,传统线下售票模式存在排队耗时长、黄牛票泛滥、座位信息不透明等痛点,而现代化售票系统需要同时满足高并发抢购、实时座位锁定、多终端适配等硬性需求。
这个项目完整实现了以下核心场景:
- 主办方后台:演出信息管理、票区定价、销售数据看板
- 网页端购票:可视化选座、在线支付、电子票核验
- 移动端应用:演出推荐、扫码购票、转赠功能
- 系统管理端:用户行为分析、反爬虫机制、分布式容灾
技术选型心得:SpringBoot的约定优于配置特性大幅减少了XML配置,配合MyBatis-Plus的ActiveRecord模式让数据库操作效率提升40%以上。Vue+ElementUI的前端组合在实现后台管理系统时,组件复用率可达70%。
2. 系统架构设计解析
2.1 技术栈选型依据
后端采用SpringBoot 2.7 + MyBatis-Plus 3.5的组合,而非传统SSM框架,主要基于以下考量:
- 自动配置机制减少70%以上的XML配置
- 内嵌Tomcat支持快速部署
- Actuator端点提供完善的系统监控
- MyBatis-Plus的Lambda查询构建器避免SQL注入风险
前端架构采用Vue 3组合式API+Pinia状态管理,对比Vue 2选项式API具有:
- 代码组织更清晰(功能逻辑集中)
- TypeScript支持更完善
- 打包体积减少约30%
跨端方案选择uniapp而非原生开发,因其:
- 一套代码同时生成iOS/Android/小程序
- 内置组件库覆盖90%移动端场景
- 热更新机制避免应用商店审核延迟
2.2 高并发场景设计
票务系统在开票时刻需要应对瞬时万级QPS,我们采用分级解决方案:
// 库存扣减核心逻辑示例 @Transactional public boolean deductStock(Long ticketId, int quantity) { // 1. 乐观锁校验 Ticket ticket = ticketMapper.selectByIdForUpdate(ticketId); if (ticket.getStock() < quantity) { return false; } // 2. 扣减库存 ticketMapper.updateStock(ticketId, quantity); // 3. 创建订单记录 Order order = new Order(); order.setTicketId(ticketId); orderService.create(order); return true; }配套措施包括:
- Redis分布式锁防止超卖
- 库存预热(提前加载热点数据到Redis)
- 队列削峰(RabbitMQ延迟消费)
- 读多写少场景下使用Caffeine本地缓存
3. 核心功能模块实现
3.1 可视化选座系统
采用Canvas+WebSocket实现实时座位状态同步:
- 座位数据模型设计:
CREATE TABLE `seat` ( `id` bigint NOT NULL AUTO_INCREMENT, `venue_id` bigint NOT NULL COMMENT '场馆ID', `zone` varchar(20) NOT NULL COMMENT '区域(A区/B区)', `row_num` int NOT NULL COMMENT '排号', `col_num` int NOT NULL COMMENT '列号', `status` tinyint DEFAULT '0' COMMENT '0-可售 1-锁定 2-已售', `price` decimal(10,2) NOT NULL, PRIMARY KEY (`id`), KEY `idx_venue` (`venue_id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;- 前端交互流程:
- 初始化加载场馆SVG底图
- WebSocket建立长连接
- 用户hover时显示座位详情
- 点击座位触发锁定请求(15分钟时效)
- 三维视角切换使用CSS 3D transform
3.2 支付系统集成
采用策略模式支持多种支付方式:
public interface PaymentStrategy { PaymentResult pay(Order order); } @Service @RequiredArgsConstructor public class PaymentService { private final Map<String, PaymentStrategy> strategies; public PaymentResult handlePayment(Order order, String paymentType) { PaymentStrategy strategy = strategies.get(paymentType + "Strategy"); if (strategy == null) { throw new IllegalArgumentException("Unsupported payment type"); } return strategy.pay(order); } }关键安全措施:
- 支付参数RSA加密
- 异步通知验签
- 对账定时任务(每日凌晨2点执行)
- 敏感操作日志审计
4. 部署架构与性能优化
4.1 生产环境部署方案
采用Docker Compose编排微服务:
version: '3.8' services: mysql: image: mysql:8.0 environment: MYSQL_ROOT_PASSWORD: ${DB_PASSWORD} volumes: - ./mysql/data:/var/lib/mysql redis: image: redis:6.2 ports: - "6379:6379" app: build: . ports: - "8080:8080" depends_on: - mysql - redisNginx配置要点:
# 静态资源缓存 location ~* \.(js|css|png)$ { expires 30d; add_header Cache-Control "public"; } # WebSocket代理 location /ws { proxy_pass http://backend; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; }4.2 性能调优实战
通过Arthas诊断发现的问题及解决方案:
- 慢SQL优化:
- 原查询:
SELECT * FROM orders WHERE user_id = ? AND status IN (1,2,3) - 优化后:
SELECT id,order_no FROM orders WHERE user_id = ? AND status IN (1,2,3) USE INDEX(idx_user_status)
- JVM参数调整:
# 原配置 -Xms1g -Xmx1g # 优化后(G1垃圾回收器) -Xms4g -Xmx4g -XX:+UseG1GC -XX:MaxGCPauseMillis=200- Redis热点key解决方案:
- 本地缓存+Redis多级缓存
- key增加随机后缀分散存储
5. 安全防护体系构建
5.1 防黄牛技术方案
- 行为特征识别:
- 相同IP高频请求
- 鼠标移动轨迹异常
- 页面停留时间过短
- 限流策略:
@RateLimiter(value = 10, key = "#userId") public ApiResult createOrder(Long userId) { // 下单逻辑 }- 验证码策略:
- 滑动验证(开票前30分钟启用)
- 短信二次确认(敏感操作时触发)
5.2 数据安全措施
- 敏感数据加密:
// 手机号脱敏存储 @Column(columnDefinition = "varchar(64) comment '加密手机号'") @EncryptField private String mobile;- 日志审计方案:
- 关键操作记录修改前后快照
- 使用Spring AOP实现操作日志切面
- 日志文件加密存储
- 接口安全:
- JWT令牌过期时间设置为2小时
- 敏感接口增加时间戳+签名校验
- 定期更换RSA密钥对
6. 移动端专项优化
6.1 uniapp性能提升技巧
- 图片加载优化:
- 使用webp格式(体积减少50%)
- 实现懒加载+占位图
- 七牛云CDN加速
- 页面渲染优化:
- 复杂列表使用虚拟滚动
- 避免在v-for中使用v-if
- 使用uni.$on/uni.$off替代全局事件
- 打包配置优化:
// manifest.json { "optimization": { "treeShaking": { "enable": true } } }6.2 微信小程序适配经验
- 登录流程改造:
- 原流程:获取code→后端换token
- 优化后:静默登录+定期刷新token
- 分享功能增强:
- 自定义分享卡片(带演出海报)
- 分享链路追踪(UTM参数)
- 订阅消息模板:
- 购票成功通知
- 演出前提醒
- 座位变更通知
踩坑记录:uniapp的rpx单位在部分Android机型上存在计算误差,建议关键布局使用px+flex组合方案。微信小程序canvas层级问题可通过同层渲染解决,但需要基础库版本>=2.16.0。
7. 项目演进方向
- 智能推荐系统
- 基于用户浏览历史的协同过滤
- 演出类型偏好分析
- 好友购票动态展示
- 元宇宙场景扩展
- 虚拟场馆漫游
- AR座位预览
- NFT纪念票根
- 大数据分析看板
- 销售热力图
- 用户画像分析
- 票价弹性预测模型
这个项目从零开始构建完整票务系统的过程中,最深刻的体会是:高并发系统必须从设计阶段就考虑扩展性,任何单点都可能成为瓶颈。我们在压力测试中发现,当并发超过5000时,Nginx的TCP连接数配置会成为第一个瓶颈点,这促使我们提前规划了Kubernetes集群方案。