# bo-bing-game

**Repository Path**: IT_Ruan/bo-bing-game

## Basic Information

- **Project Name**: bo-bing-game
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-09-11
- **Last Updated**: 2025-09-16

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 福州博饼游戏

一个基于 Vue3 + WebSocket + Redis 的在线博饼游戏应用。

## 技术栈

### 前端
- Vue 3 + TypeScript
- Unocss（样式和骰子动画）
- Naive UI（UI组件库）
- Socket.io-client（WebSocket客户端）

### 后端
- Node.js
- Socket.io（WebSocket服务器）
- Redis（数据存储）
- Express（HTTP服务器）

## 功能特性

- 🎲 实时多人博饼游戏
- 🏠 房间系统（创建/加入房间）
- 🎯 七种博饼奖项支持
- 📊 实时排行榜
- 🎨 精美的骰子动画
- 📱 响应式设计

## 快速开始

### 方式一：使用启动脚本（推荐）

**Linux/macOS:**
```bash
chmod +x start.sh
./start.sh
```

**Windows:**
```cmd
start.bat
```

### 方式二：手动启动

1. 安装依赖
```bash
npm run install:all
```

2. 启动 Redis 服务器
```bash
# Linux/macOS
redis-server

# Windows (如果安装了 Redis)
redis-server.exe
```

3. 创建环境配置文件
```bash
# 服务器配置
cp server/.env.example server/.env

# 客户端配置  
cp client/.env.example client/.env
```

4. 启动开发环境
```bash
npm run dev
```

5. 访问应用
- 前端: http://localhost:5173
- 后端: http://localhost:3000
- 健康检查: http://localhost:3000/health

## 项目结构

```
bo-bing-game/
├── client/                    # Vue3 前端应用
│   ├── src/
│   │   ├── components/       # Vue 组件
│   │   ├── views/           # 页面组件
│   │   ├── stores/          # Pinia 状态管理
│   │   ├── services/        # API 和 Socket 服务
│   │   └── router/          # 路由配置
│   ├── public/              # 静态资源
│   └── package.json
├── server/                   # Node.js 后端服务
│   ├── src/
│   │   ├── services/        # 业务服务
│   │   ├── socketHandlers/  # Socket.IO 处理器
│   │   ├── utils/           # 工具函数
│   │   └── index.ts         # 服务器入口
│   └── package.json
├── shared/                   # 共享类型定义
│   └── types.ts
├── start.sh                 # Linux/macOS 启动脚本
├── start.bat                # Windows 启动脚本
└── README.md
```

## 核心功能

### 🎮 游戏流程
1. **进入游戏** - 输入昵称进入大厅
2. **创建/加入房间** - 房主可配置奖品数量和玩家上限
3. **开始游戏** - 房主启动游戏，玩家轮流掷骰子
4. **实时对战** - WebSocket 实现实时通信和状态同步
5. **结算排名** - 游戏结束后显示详细排行榜

### 🎲 博饼规则
- **状元插金花** 🌸 - 六个四点（最高奖项）
- **状元** 👑 - 五个四点或六个相同点数
- **对堂** 🎭 - 1-6点各一个
- **三红** 🔴 - 三个四点
- **四进** 🎯 - 四个相同点数（非四点）
- **二举** ✌️ - 两个四点
- **一秀** ⭐ - 一个四点

### 🎨 界面特色
- **精美动画** - 骰子掷出动画和获奖特效
- **实时更新** - 奖品库存和玩家状态实时显示
- **响应式设计** - 支持桌面和移动设备
- **直观操作** - 简洁的用户界面和流畅的交互

## 技术架构

### 前端架构
- **Vue 3** - 使用 Composition API 和 TypeScript
- **Pinia** - 状态管理，管理游戏状态和玩家信息
- **Vue Router** - 页面路由，支持房间跳转
- **Naive UI** - UI 组件库，提供表格、对话框等组件
- **UnoCSS** - 原子化 CSS，实现骰子动画和样式
- **Socket.io-client** - WebSocket 客户端通信

### 后端架构
- **Node.js + TypeScript** - 服务器运行环境
- **Express** - HTTP 服务器框架
- **Socket.IO** - WebSocket 实时通信
- **Redis** - 数据存储，缓存房间状态和玩家信息
- **游戏服务** - 博饼规则判定和游戏流程控制

### 数据流
1. **客户端** 通过 Socket.IO 连接服务器
2. **服务器** 处理游戏逻辑并更新 Redis 状态
3. **实时广播** 游戏状态变化给房间内所有玩家
4. **状态同步** 确保所有客户端数据一致

## 开发指南

### 环境要求
- Node.js >= 16.0.0
- Redis >= 6.0.0
- npm >= 8.0.0

### 开发命令
```bash
# 安装所有依赖
npm run install:all

# 启动开发环境（前端+后端）
npm run dev

# 仅启动前端
npm run dev:client

# 仅启动后端
npm run dev:server

# 构建前端
npm run build

# 启动生产环境
npm start
```

### 项目配置
- **服务器配置**: `server/.env`
- **客户端配置**: `client/.env`
- **TypeScript 配置**: `tsconfig.json`
- **Vite 配置**: `client/vite.config.ts`
- **UnoCSS 配置**: `client/unocss.config.ts`

### 测试
```bash
# 运行游戏规则测试
cd server && npm run test:rules

# 运行所有测试
cd server && npm test
```

## Docker 部署

### 使用 Docker Compose（推荐）
```bash
# 启动所有服务
docker-compose up -d

# 查看日志
docker-compose logs -f

# 停止服务
docker-compose down
```

### 手动 Docker 部署
```bash
# 启动 Redis
docker run -d --name redis -p 6379:6379 redis:7-alpine

# 构建并启动后端
docker build -f Dockerfile.server -t bo-bing-server .
docker run -d --name server -p 3000:3000 --link redis bo-bing-server

# 构建并启动前端
docker build -f Dockerfile.client -t bo-bing-client .
docker run -d --name client -p 5173:5173 bo-bing-client
```

## 故障排除

### 常见问题
1. **Redis 连接失败**
   - 检查 Redis 服务是否启动
   - 确认 Redis 端口 6379 未被占用

2. **前端无法连接后端**
   - 检查后端服务是否启动在 3000 端口
   - 确认防火墙设置允许相应端口

3. **WebSocket 连接失败**
   - 检查网络代理设置
   - 确认 Socket.IO 版本兼容性

### 调试模式
```bash
# 启用调试日志
export NODE_ENV=development

# 查看详细日志
npm run dev
```

## 贡献指南

1. Fork 项目
2. 创建功能分支 (`git checkout -b feature/AmazingFeature`)
3. 提交更改 (`git commit -m 'Add some AmazingFeature'`)
4. 推送到分支 (`git push origin feature/AmazingFeature`)
5. 打开 Pull Request

## 许可证

本项目采用 MIT 许可证 - 查看 [LICENSE](LICENSE) 文件了解详情。

## 致谢

- 感谢 Vue.js 团队提供优秀的前端框架
- 感谢 Socket.IO 团队提供实时通信解决方案
- 感谢 Redis 团队提供高性能数据存储
- 感谢所有为开源社区做出贡献的开发者们