admin/nanocode

Fork 0

Files

T

Ubuntu 32b43f85bd a

2026-07-03 16:58:28 +08:00

8.3 KiB

Raw Blame History

玩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

{
  "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

{
  "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

{
  "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

{
  "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，平滑切换动画
✅ 交互反馈: 触摸反馈、加载状态、错误提示
✅ 响应式设计: 适配不同屏幕尺寸
✅ 深色模式: 支持系统深色主题

🚀 快速测试

使用浏览器

打开浏览器
访问 http://129.211.173.87:8080
测试页面功能
检查API接口

使用命令行

# 测试健康检查
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测试脚本

cd /home/ubuntu/wanandroid/uniapp_android
python3 test_server_access.py

🔍 测试验证

已通过测试

✅ 本地访问测试: 6/6 通过
✅ 公网访问测试: 2/2 通过
✅ API格式测试: 3/3 通过
✅ 响应时间测试: 平均 < 5ms
✅ 错误处理测试: 404页面、错误提示

测试结果

总体结果: 11/11 项测试通过
服务器状态: 健康运行
网络可达: 公网访问正常
功能完整: 所有页面和API正常

⚙️ 服务器管理

服务器进程

PID: 2365681
日志文件: server.log
PID文件: server.pid

管理命令

# 查看服务器日志
tail -f /home/ubuntu/wanandroid/uniapp_android/server.log

# 查看服务器进程
ps aux | grep node

# 停止服务器
kill 2365681

# 重启服务器
cd /home/ubuntu/wanandroid/uniapp_android
./start_server.sh

启动脚本

# 启动服务器
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. 访问测试

# 1. 打开浏览器访问
http://129.211.173.87:8080

# 2. 测试功能
- 点击搜索栏
- 查看Banner轮播
- 浏览文章列表
- 测试底部导航

# 3. 验证API
http://129.211.173.87:8080/api/banner/json

2. 打包部署

# 1. 下载项目
# 项目位置: /home/ubuntu/wanandroid/uniapp_android

# 2. 导入HBuilder X
# 文件 → 导入 → 从本地目录导入

# 3. 打包APK
# 发行 → 原生App-云打包 → Android

3. 持续开发

# 1. 修改代码
# 编辑 pages/index/index.vue 等文件

# 2. 重启服务器
kill 2365681
./start_server.sh

# 3. 测试修改
http://129.211.173.87:8080

📞 故障排除

常见问题

1. 无法访问

# 检查服务器状态
curl http://localhost:8080/health

# 检查端口占用
netstat -tlnp | grep :8080

# 重启服务器
cd /home/ubuntu/wanandroid/uniapp_android
./start_server.sh

2. 页面加载慢

# 检查网络
ping 129.211.173.87

# 检查服务器负载
top -p 2365681

# 查看日志
tail -f server.log

3. API返回错误

# 测试API
curl http://129.211.173.87:8080/api/banner/json

# 检查服务器代码
cat server.js | grep -n "banner"

日志查看

# 实时查看日志
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

🎯 下一步

立即操作

访问测试: 打开 http://129.211.173.87:8080
功能验证: 测试所有页面和API
打包准备: 下载项目文件，导入HBuilder X

后续开发

完善功能: 实现搜索、登录、收藏等
优化性能: 添加缓存、压缩、CDN等
部署生产: 配置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应用！

8.3 KiB Raw Blame History