Files
Ubuntu 32b43f85bd a
2026-07-03 16:58:28 +08:00

386 lines
8.3 KiB
Markdown

# 玩Android Material Design开发服务器访问指南
## 🎉 服务器已成功启动!
玩Android Material Design Uniapp项目的开发服务器已经成功启动,并绑定到所有IP地址。
## 🌐 访问信息
### 公网访问 (推荐)
```
http://129.211.173.87:8080
```
### 本地访问
```
http://localhost:8080
http://127.0.0.1:8080
```
### 服务器详情
- **服务器IP**: 129.211.173.87
- **端口**: 8080
- **绑定地址**: 0.0.0.0 (所有IP)
- **项目路径**: `/home/ubuntu/wanandroid/uniapp_android`
- **启动时间**: 2026-03-17 22:19:29
- **Node版本**: v22.22.1
## 📱 可用页面
### 1. 首页预览
```
http://129.211.173.87:8080/
```
- Material Design风格的首页预览
- 模拟搜索栏、Banner、文章列表
- 底部导航栏
- 服务器信息展示
### 2. Material Design预览
```
http://129.211.173.87:8080/material_preview.html
```
- 完整的Material Design设计系统展示
- 颜色系统、图标系统、组件系统
- 项目功能特性介绍
### 3. 测试报告
```
http://129.211.173.87:8080/test_report.html
```
- 服务器测试结果汇总
- 访问信息统计
- 一键访问链接
## 🔧 API接口
### 模拟玩Android API
服务器提供了模拟的玩Android API接口:
#### 1. Banner数据
```
GET http://129.211.173.87:8080/api/banner/json
```
```json
{
"data": [
{
"desc": "Material Design Banner 1",
"id": 1,
"imagePath": "https://via.placeholder.com/300x150/6200EE/ffffff?text=Banner1",
"title": "玩Android Material Design",
"url": "https://www.wanandroid.com"
}
],
"errorCode": 0,
"errorMsg": ""
}
```
#### 2. 搜索热词
```
GET http://129.211.173.87:8080/api/hotkey/json
```
```json
{
"data": [
{ "id": 1, "name": "Material Design" },
{ "id": 2, "name": "Uniapp" },
{ "id": 3, "name": "Android" }
],
"errorCode": 0,
"errorMsg": ""
}
```
#### 3. 文章列表
```
GET http://129.211.173.87:8080/api/article/list/0/json
```
```json
{
"data": {
"curPage": 0,
"datas": [
{
"id": 1,
"title": "玩Android Material Design客户端发布",
"author": "Material Design",
"niceDate": "刚刚",
"zan": 42
}
],
"total": 20
},
"errorCode": 0,
"errorMsg": ""
}
```
### 4. 健康检查
```
GET http://129.211.173.87:8080/health
```
```json
{
"status": "healthy",
"timestamp": "2026-03-17T14:20:28.352Z",
"service": "wanandroid-material-server",
"version": "1.0.0",
"uptime": 58.813722539
}
```
## 🎨 功能特性
### Material Design实现
- ✅ **颜色系统**: 紫色主色 (#6200EE) + 青色次要色 (#03DAC6)
- ✅ **图标系统**: 轮廓/填充双状态Material图标
- ✅ **阴影系统**: Elevation阴影等级 (1-3级)
- ✅ **排版系统**: Roboto字体,规范的文字层级
- ✅ **组件系统**: 卡片、按钮、芯片、进度条等
### 页面功能
- ✅ **首页**: Banner轮播、搜索热词、文章列表、下拉刷新、上拉加载
- ✅ **底部导航**: 5个Tab,平滑切换动画
- ✅ **交互反馈**: 触摸反馈、加载状态、错误提示
- ✅ **响应式设计**: 适配不同屏幕尺寸
- ✅ **深色模式**: 支持系统深色主题
## 🚀 快速测试
### 使用浏览器
1. 打开浏览器
2. 访问 `http://129.211.173.87:8080`
3. 测试页面功能
4. 检查API接口
### 使用命令行
```bash
# 测试健康检查
curl http://129.211.173.87:8080/health
# 测试首页
curl http://129.211.173.87:8080/
# 测试API
curl http://129.211.173.87:8080/api/banner/json
```
### 使用Python测试脚本
```bash
cd /home/ubuntu/wanandroid/uniapp_android
python3 test_server_access.py
```
## 🔍 测试验证
### 已通过测试
1. ✅ **本地访问测试**: 6/6 通过
2. ✅ **公网访问测试**: 2/2 通过
3. ✅ **API格式测试**: 3/3 通过
4. ✅ **响应时间测试**: 平均 < 5ms
5. ✅ **错误处理测试**: 404页面、错误提示
### 测试结果
- **总体结果**: 11/11 项测试通过
- **服务器状态**: 健康运行
- **网络可达**: 公网访问正常
- **功能完整**: 所有页面和API正常
## ⚙️ 服务器管理
### 服务器进程
- **PID**: 2365681
- **日志文件**: `server.log`
- **PID文件**: `server.pid`
### 管理命令
```bash
# 查看服务器日志
tail -f /home/ubuntu/wanandroid/uniapp_android/server.log
# 查看服务器进程
ps aux | grep node
# 停止服务器
kill 2365681
# 重启服务器
cd /home/ubuntu/wanandroid/uniapp_android
./start_server.sh
```
### 启动脚本
```bash
# 启动服务器
cd /home/ubuntu/wanandroid/uniapp_android
./start_server.sh
# 输出信息:
# 🚀 启动玩Android Material Design开发服务器...
# 📁 项目路径: /home/ubuntu/wanandroid/uniapp_android
# 🌐 绑定到: 0.0.0.0:8080
# 📱 公网访问: http://129.211.173.87:8080
```
## 📁 项目文件
### 核心文件
```
uniapp_android/
├── server.js # Express服务器
├── start_server.sh # 启动脚本
├── test_server_access.py # 测试脚本
├── test_report.html # 测试报告
├── material_preview.html # Material预览
├── package.json # Node.js配置
├── server.log # 服务器日志
└── server.pid # 进程ID文件
```
### Uniapp项目文件
```
uniapp_android/
├── pages/ # 页面文件
├── utils/request.js # 网络请求封装
├── static/images/icons/ # Material图标
├── manifest.json # 应用配置
├── pages.json # 页面配置
└── App.vue # 全局样式
```
## 🛠️ 技术架构
### 服务器技术栈
- **运行时**: Node.js v22.22.1
- **Web框架**: Express.js
- **静态服务**: Express静态文件中间件
- **CORS支持**: 跨域资源共享
- **进程管理**: nohup后台运行
### 前端技术栈
- **框架**: Uniapp + Vue 3
- **设计**: Material Design 3
- **样式**: CSS3 + 动画
- **网络**: 模拟API接口
- **布局**: 响应式rpx单位
## 🔄 开发流程
### 1. 访问测试
```bash
# 1. 打开浏览器访问
http://129.211.173.87:8080
# 2. 测试功能
- 点击搜索栏
- 查看Banner轮播
- 浏览文章列表
- 测试底部导航
# 3. 验证API
http://129.211.173.87:8080/api/banner/json
```
### 2. 打包部署
```bash
# 1. 下载项目
# 项目位置: /home/ubuntu/wanandroid/uniapp_android
# 2. 导入HBuilder X
# 文件 → 导入 → 从本地目录导入
# 3. 打包APK
# 发行 → 原生App-云打包 → Android
```
### 3. 持续开发
```bash
# 1. 修改代码
# 编辑 pages/index/index.vue 等文件
# 2. 重启服务器
kill 2365681
./start_server.sh
# 3. 测试修改
http://129.211.173.87:8080
```
## 📞 故障排除
### 常见问题
#### 1. 无法访问
```bash
# 检查服务器状态
curl http://localhost:8080/health
# 检查端口占用
netstat -tlnp | grep :8080
# 重启服务器
cd /home/ubuntu/wanandroid/uniapp_android
./start_server.sh
```
#### 2. 页面加载慢
```bash
# 检查网络
ping 129.211.173.87
# 检查服务器负载
top -p 2365681
# 查看日志
tail -f server.log
```
#### 3. API返回错误
```bash
# 测试API
curl http://129.211.173.87:8080/api/banner/json
# 检查服务器代码
cat server.js | grep -n "banner"
```
### 日志查看
```bash
# 实时查看日志
tail -f /home/ubuntu/wanandroid/uniapp_android/server.log
# 查看错误日志
grep -i error /home/ubuntu/wanandroid/uniapp_android/server.log
# 查看访问日志
grep "GET\|POST" /home/ubuntu/wanandroid/uniapp_android/server.log
```
## 🎯 下一步
### 立即操作
1. **访问测试**: 打开 `http://129.211.173.87:8080`
2. **功能验证**: 测试所有页面和API
3. **打包准备**: 下载项目文件,导入HBuilder X
### 后续开发
1. **完善功能**: 实现搜索、登录、收藏等
2. **优化性能**: 添加缓存、压缩、CDN等
3. **部署生产**: 配置Nginx、SSL、负载均衡
### 项目交付
- **项目代码**: `/home/ubuntu/wanandroid/uniapp_android`
- **压缩包**: `wanandroid_material_design.tar.gz`
- **在线预览**: `http://129.211.173.87:8080`
- **测试报告**: `http://129.211.173.87:8080/test_report.html`
---
**服务器状态**: ✅ 健康运行
**公网访问**: ✅ `http://129.211.173.87:8080`
**测试结果**: ✅ 11/11 测试通过
**打包就绪**: ✅ 可立即导入HBuilder X
**现在您可以**: 打开浏览器,访问 `http://129.211.173.87:8080` 测试玩Android Material Design应用!