更新记录

1.0.1（2026-06-21）

多项目共用空间：后台 admin、小程序 demo 可绑定同一个 uniCloud 服务空间，共用一套云函数与数据库 打包区分： Web 端：使用【WEB 发行】部署 uniCloud 前端网页托管 微信小程序：配置 AppID + 合法域名后上传发布 计费提醒：阿里云按量计费用户注意 2026 年 3 月起新增小时最低消费 访问入口：Web 后台部署完成后，使用系统生成的 bspapp 域名即可在线登录管理 离线打包：安卓 / iOS 原生 App 离线打包需额外单独配置 Android、iOS 原生参数

平台兼容性

云端兼容性

云函数类插件通用教程

使用云函数类插件的前提是：使用HBuilderX 2.9+

最美证件照 uniCloud 全套安装部署手册

项目目录结构

demo/
├── App.vue                      # 应用入口组件
├── main.js                      # 应用入口逻辑
├── manifest.json                # 应用配置（AppID、权限、分包等）
├── pages.json                   # 页面路由配置
├── uni.scss                     # 全局样式变量
├── uni.promisify.adaptor.js     # Promise 适配器
│
├── components/                  # 公共组件
│   ├── header.vue               # 页面头部组件
│   └── loading.vue              # 加载状态组件
│
├── pages/                       # 页面目录
│   ├── index/                   # 首页模块
│   │   ├── index.vue            # 首页（入口）
│   │   ├── index0.vue           # 首页（备用样式）
│   │   ├── show.vue             # 证件照展示/制作页
│   │   ├── show0.vue            # 展示页（备用样式）
│   │   ├── download.vue         # 证件照下载页
│   │   └── download0.vue        # 下载页（备用样式）
├── static/                      # 静态资源
│   ├── 1.png ~ 5.png            # 首页展示图片
│   └── clothes/                 # 换装素材
│       ├── boy/   (17 张)       # 男装
│       ├── child/ (7 张)        # 童装
│       └── girl/  (17 张)       # 女装
│
├── utils/                       # 工具函数
│   ├── color.js                 # 颜色处理（hex → 名称匹配）
│   ├── image.js                 # 图片处理（压缩、裁剪）
│   ├── reqImg.js                # API 请求封装（证件照制作 v3）
│   └── sizeData.js              # 尺寸数据处理
│
├── uni_modules/                 # uni-app 扩展模块
│   └── uview-next/              # UI 组件库
│
└── uniCloud-aliyun/             # 云服务端（阿里云）
    ├── database/                # 数据库表
    │
    └── cloudfunctions/          # 云函数

一、登录并创建 uniCloud 云服务空间

1. 访问地址

uniCloud 服务空间官网：https://dcloud.net.cn

2. 新建服务空间操作

1. 登录账号后进入服务空间首页，服务商可选：阿里云 / 腾讯云 / 支付宝云

2. 填写服务空间名称，命名强制规则：

   • 仅允许小写字母、数字、中划线 -
   • 必须以字母开头
   • 字符长度 3–25 位

3. 付费方式三选一：免费 / 包年包月 / 按量计费

   ⚠️ 备注：阿里云云函数计费规则 2026 年 3 月 16 日已调整，新增小时级最低消费，可官网查看详情

4. 点击「立即购买」，等待十几分钟完成自动初始化

二、后台管理系统搭建（admin 项目）

该目录下admin.rar是后台代码

2.1 关联云空间

1. HBuilderX 打开 admin 后台项目
2. 右键项目目录 uniCloud → 选择【关联服务空间】
3. 选择对应服务商（阿里云 / 腾讯云 / 支付宝云），选中刚创建的服务空间（示例：ceshi01），点击「关联」

2.2 初始化 & 部署云空间资源

1. 关联完成后再次右键 uniCloud →【初始化云空间】
2. 弹窗选择绑定的服务空间，点击「下一步」
3. 进入部署页面，会自动执行两项操作：
   • 部署项目全部云函数、公共模块、actions
   • 初始化服务空间配套数据库
4. 点击「开始部署」等待云端资源上传完成

2.3 本地运行后台系统

1. HBuilderX 运行项目，本地访问地址：http://localhost:5173/#/

2. 后台登录账号密码：

   账号	密码
   admin	123456

2.4 后台系统参数配置

登录后台后进入左侧【系统设置】菜单：

1. 站点名称：自定义填写（示例：最美证件照）

2. 接口 Key：前往接口地址自行申请后填入

   Key 申请文档地址：https://zjzapi.com/doc/v3.html

3. 点击「保存设置」生效

4. 证件照规格、背景色配置：

   • 尺寸列表：一寸、二寸、小一寸、大一寸、护照、签证、教资、会计证等通用证件尺寸
   • 颜色列表：纯白、深蓝、浅蓝、红色、黑色等标准证件背景色
   • 操作参考：参照系统已有数据格式新增自定义尺寸 / 色值

2.5 后台网页打包部署（Web 前端托管）

1. 打开项目根目录 manifest.json：
   • 基础配置：修改自定义应用名称、版本号（升级版本号必须大于旧版本）
   • uniCloud：选择已绑定的阿里云服务空间
2. 顶部菜单栏【发行】→【WEB 发行】
3. 配置项：
   • 填写网站标题、自定义域名
   • 勾选「生成 sourcemap」（可选，用于错误日志分析）
   • 目标服务空间选择已开通前端网页托管的云空间
4. 点击「发行」自动上传全部静态资源
5. 部署完成提示：
   • 全部文件上传成功，系统生成线上访问链接
   • 缓存刷新、跨域、自定义域名、SSL 证书需前往 uniCloud 网页控制台配置

三、小程序前端项目搭建（demo）

3.1 关联云空间 & 基础配置修改

1. HBuilderX 打开前端 demo 项目，右键 uniCloud →【关联服务空间】，绑定同一阿里云服务空间
2. 打开 manifest.json 修改自定义信息：
   • 应用名称、应用描述、版本名称、版本号（整数，1~2147483647，升级需递增）

3. 微信小程序配置栏填写自己的小程序 AppID

   📌 获取途径：微信公众平台后台 → 开发管理 → 开发设置

   示例 ID：wx1b224746ca331028

3.2 小程序后台配置合法域名

登录微信公众平台 → 开发管理 → 开发设置，添加以下域名：

3.3 预览 / 上传发布小程序

1. HBuilderX 切换至「小程序模式」，可选择：预览、真机调试、上传代码
2. 上传代码后前往微信公众平台提交审核、发布上线
3. 小程序功能包含：AI 抠图、证件照换背景、美颜、多规格证件照一键生成

四、关键补充说明

1. 多项目共用空间：后台 admin、小程序 demo 可绑定同一个 uniCloud 服务空间，共用一套云函数与数据库
2. 打包区分：
   • Web 端：使用【WEB 发行】部署 uniCloud 前端网页托管
   • 微信小程序：配置 AppID + 合法域名后上传发布
3. 计费提醒：阿里云按量计费用户注意 2026 年 3 月起新增小时最低消费
4. 访问入口：Web 后台部署完成后，使用系统生成的 bspapp 域名即可在线登录管理
5. 离线打包：安卓 / iOS 原生 App 离线打包需额外单独配置 Android、iOS 原生参数