用户管理系统 - 微信云开发全栈项目

基于微信云开发的用户管理系统，包含微信小程序端和 Vue3 管理后台。

项目结构

Insurance_manager/
├── miniprogram/          # 微信小程序
│   ├── pages/
│   │   ├── index/        # 个人中心页
│   │   ├── agreement/    # 协议详情页
│   │   └── privacy-popup/ # 隐私授权弹窗
│   ├── utils/            # 工具函数
│   ├── images/           # 图片资源（需自行添加）
│   ├── app.js
│   ├── app.json
│   └── app.wxss
│
├── cloudfunctions/       # 云函数
│   ├── user-auth/        # 微信用户登录
│   ├── admin-login/      # 管理员登录
│   ├── article-manage/   # 文章管理
│   ├── import-excel/     # Excel导入
│   └── agreement-check/  # 协议检查
│
├── admin/                # Vue3 管理后台
│   ├── src/
│   │   ├── views/        # 页面组件
│   │   ├── components/   # 布局组件
│   │   ├── router/       # 路由配置
│   │   ├── store/        # Pinia状态管理
│   │   └── utils/        # 工具函数
│   └── package.json
│
├── database-rules/       # 数据库安全规则
└── scripts/              # 初始化脚本

---

快速开始

前置条件

• 微信开发者工具（最新版）
• Node.js 18+
• 微信小程序 AppID
• 开通微信云开发

---

第一步：创建云开发环境

1. 打开微信开发者工具，导入 miniprogram/ 目录
2. 在工具栏点击「云开发」→「开通」
3. 创建环境，记录环境 ID（格式如：your-env-xxxx）

---

第二步：配置小程序

2.1 修改环境ID

编辑 miniprogram/app.js：

cloudEnvId: 'your-env-id',  // 替换为你的环境ID

2.2 修改 AppID

编辑 miniprogram/project.config.json：

"appid": "your-appid"  // 替换为你的小程序AppID

2.3 添加图片资源

在 miniprogram/images/ 目录下放入：

• logo.png - 小程序Logo（100×100）
• default-avatar.png - 默认头像（100×100）
• tab-my.png - tabBar图标（未选中）
• tab-my-active.png - tabBar图标（选中）

---

第三步：创建云数据库集合

在云开发控制台 → 数据库，创建以下集合：

集合名	权限配置
users	自定义（见下方规则）
imported_users	仅创建者可读写 → 改为自定义
admins	仅创建者可读写 → 改为自定义
articles	所有人可读，仅创建者可写 → 改为自定义
user_agreements	自定义

配置数据库安全规则

在控制台每个集合的「权限设置」→「高级设置」，粘贴对应规则：

users 集合：

{
  "read": "auth.openid == doc._openid",
  "write": "auth.openid == doc._openid"
}

articles 集合：

{
  "read": "doc.status == 'published'",
  "write": false
}

imported_users / admins 集合：

{
  "read": false,
  "write": false
}

user_agreements 集合：

{
  "read": "auth.openid == doc.openid",
  "write": "auth.openid == doc.openid"
}

---

第四步：部署云函数

1. 在微信开发者工具中，右键点击 cloudfunctions/ 目录下的每个云函数文件夹
2. 选择「上传并部署：云端安装依赖」
3. 等待部署完成（每个函数约30-60秒）

部署顺序：

1. user-auth
2. admin-login
3. article-manage
4. import-excel
5. agreement-check

---

第五步：初始化超级管理员

方法一：通过云函数控制台（推荐）

1. 将 scripts/init-admin.js 的内容创建为一个临时云函数（名为 init-admin）
2. 复制 scripts/init-admin-package.json 的内容为该云函数的 package.json
3. 部署后在云开发控制台「云函数」→ 点击 init-admin → 「测试」
4. 传入参数：

{
  "username": "admin",
  "password": "admin123",
  "nickname": "超级管理员"
}

5. 运行成功后，删除 init-admin 云函数

方法二：直接在数据库插入

在云开发控制台 → 数据库 → admins 集合 → 「添加记录」：

⚠️ 注意：密码需先用 bcrypt 加密，不能明文存储。建议使用方法一。

---

第六步：部署管理后台

6.1 安装依赖

cd admin
npm install

6.2 配置环境变量

cp .env.example .env.local
# 编辑 .env.local，填入你的云开发环境ID

6.3 本地开发

npm run dev
# 访问 http://localhost:3000

6.4 构建生产版本

npm run build
# 产物在 admin/dist/ 目录

6.5 部署到云开发静态托管

方法一：微信开发者工具

1. 在云开发控制台 → 「静态网站托管」→ 「部署」
2. 选择 admin/dist/ 目录上传

方法二：使用 CloudBase CLI

# 安装 CLI
npm install -g @cloudbase/cli

# 登录
tcb login

# 部署
tcb hosting deploy admin/dist -e your-env-id

6.6 管理后台调用云函数说明

⚠️ 重要：微信云开发的 HTTP API 鉴权需要服务器端持有密钥。

建议方案：在云开发中开启 HTTP 访问服务（云托管），通过 Node.js 服务中转云函数调用，避免在前端暴露密钥。

简化方案（开发/演示用）：直接在小程序端调用云函数返回 JWT Token，管理后台用此 Token 调用云函数。

---

第七步：登录管理后台

访问静态托管域名，使用初始化的管理员账号登录：

• 用户名：admin
• 密码：admin123

首次登录后请立即修改密码！

---

安全检查清单

• 修改默认管理员密码
• 替换 JWT 密钥（所有云函数中的 JWT_SECRET）
• 配置数据库安全规则
• 删除 init-admin 初始化云函数
• 小程序隐私协议填写完整
• 云函数环境变量配置（不要硬编码密钥）

---

云函数接口文档

user-auth（微信用户认证）

action	参数	说明
login	{ code, userInfo, agreedProtocol }	微信登录/注册
updatePhone	{ phoneCode }	更新手机号
getUserInfo	-	获取当前用户信息

admin-login（管理员认证）

action	参数	说明
login	{ username, password }	管理员登录
verify	{ token }	验证Token
createAdmin	{ token, adminData }	创建管理员（超管）
updateAdmin	{ token, adminId, updateData }	更新管理员
deleteAdmin	{ token, adminId }	删除管理员
listAdmins	{ token, page, pageSize }	管理员列表

article-manage（文章管理）

action	权限	参数	说明
list	公开	{ page, pageSize, type, status }	文章列表（小程序）
detail	公开	{ id }	文章详情（小程序）
adminList	需Token	{ token, page, pageSize, ... }	文章列表（管理端）
create	需Token	{ token, title, content, type, status, ... }	创建文章
update	需Token	{ token, id, ...fields }	更新文章
delete	超管Token	{ token, id }	删除文章
updateSort	需Token	{ token, sortList }	更新排序

import-excel（导入用户）

action	说明
importData	导入Excel数据（前端解析后发送JSON）
list	导入用户列表
create	单条新增
update	更新
delete	删除
batchDelete	批量删除

---

常见问题

Q: 云函数部署失败？ A: 检查 package.json 中的依赖版本，确保 wx-server-sdk 版本正确。

Q: 小程序获取手机号失败？ A: 需要企业主体小程序，个人小程序不支持获取手机号。

Q: 管理后台无法调用云函数？ A: 需要配置 HTTP API 访问，或通过云托管部署后端服务中转。

Q: 导入Excel数据失败？ A: 确保表格第一行为表头，必填列为"姓名"，单次不超过1000条。

---

技术栈

层级	技术
小程序	微信原生框架 + 云开发 SDK
管理后台	Vue 3 + Vite + Element Plus + Pinia
富文本	wangEditor 5
后端	微信云函数（Node.js）
数据库	微信云数据库（MongoDB-like）
存储	微信云存储
部署	微信云开发静态托管