news 2026/3/8 18:14:26

uniapp+unicloud实战项目,九两酒微信小程序商城及后台管理系统前后端部署运行步骤

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
uniapp+unicloud实战项目,九两酒微信小程序商城及后台管理系统前后端部署运行步骤


通过简单的配置,即可得到一个微信小程序商城客户端和配套的vue3后台管理系统,整个项目采用的是uniapp+unicloud前后端技术栈,上线运维成本极低,功能齐全包含商城购物、优惠券、积分、签到、同城配送、商家入驻等功能,下面就演示一下如何配置部署项目。

一、获取到商城源码

获取到项目源码后,将客户端和后台管理两个文件夹,拖拽到编辑器;
假设你是一个花店,可以修改一下文件夹的名称,比如花店叫“拾光花田”。

二、基础配置

在两个项目中的根目录下找到manifest.json,修改一下应用名称,如果不修改,打包的时候将沿用初始名称,并重新获取uni-app应用标识(该操作仅限一次)

三、项目配置

因为客户端是基于微信小程序开发,所以要在客户端manifest.json修改微信小程序配置

1.修改微信小程序appid

如果你没有微信小程序appid,需要注册一个mp.weixin.qq.com,因为该项目会涉及到微信支付,注册微信小程序的时候注意不要注册个人类型的小程序,个体工商和企业类型均可。

2.安装项目依赖

在两个项目根目录上单机右键,“使用命令行窗口打开所在目录”分别执行 npm install安装项目所需依赖;

3.右击uniCloud文件夹关联服务空间

本项目是uniCloud提供后端服务,所以需要管理服务空间,如果没有服务空间,点击“关联服务空间或项目”,新建一个即可,阿里云提供一个免费版,建议购买5元/月那个版本(这5块钱基本就是你的全部投入了),如果长期使用,建议开通按量计费方式更省钱,免费版调用次数太少,耽误事。

创建完服务空间后,在后台管理项目的uniCloud目录上单击右键“关联服务空间”

在客户端项目上选择“绑定其他项目的服务空间”

4.执行初始化向导

在后台管理的unicloud目录上执行,“云服务空间初始化向导”执行该步骤会自动将云函数及schema表结构自动上传到服务空间。

如果出现服务空间已存在的弹窗,一律选择替换。

5.修改uni-id用户体系

1)找到uniCloud -> cloudfunctions ->common ->uni-config-center目录

2)修改uni-id -> config.json

  • passwordSecret和tokenSecret可以不修改,但是建议修改一下比较安全。
  • 如果实现小程序登录就配置一下"mp-weixin"下的appid和appsceret这个是在小程序后台可以获得的
  • 同理可以配置APP、web、service(短信登录)

6.修改微信商户信息uni-pay -> config.json

微信小程序支付详细的配置参数:https://blog.csdn.net/qq_18798149/article/details/151727409

7.上传uni-config-center

因为上面对uni-id和uni-pay做了修改,一定要对公共模块“uni-config-center”进行上传。

四、运行项目

后台管理系统运行到浏览器中,客户端运行到微信小程序中。

项目中出现的logo可以根据文件路径,自行替换成你的图片,比如配色也可以自己做微调。
在后台管理中,可以对商品的分类及商品进行修改删除,做成自己的内容。

客户端使用了物流查询插件,所以运行客户端会出现插件报错,手动点击添加一下即可。

五、运行完毕

至此项目配置完毕,如果想要获得该项目源码,可以通过下单课程,既能获得项目源码还能结合课程学习,掌握更多实用的技能,unipay支付微信小程序商城开发Vue3完整版。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/3/3 9:41:59

JUnit 5 中的 @ClassTemplate 实战指南

当你在本地、测试环境和 CI 中跑同一组测试时,是否遇到过这样的困惑:同一段业务逻辑在不同配置、不同 Locale 下的表现不尽相同,但你又不想为每种场景复制一堆几乎一样的测试类?如果把所有分支逻辑都塞进一个测试方法里&#xff0…

作者头像 李华
网站建设 2026/3/4 23:56:42

Parasoft Jtest 如何用 JSON 文件驱动Java 测试自动化

在金融、汽车、医疗等对可靠性与合规性要求较高的行业,Java 应用中的代码缺陷可能直接导致资金损失、服务中断或监管处罚。Parasoft Jtest 是一款企业级 Java 自动化测试平台,支持静态代码分析、智能单元测试生成、代码覆盖率评估以及合规规则检查。其内…

作者头像 李华
网站建设 2026/3/8 16:39:48

固定头尾、中间滚动?用Flex + vh轻松搞定三栏布局

固定头尾、中间滚动?用Flex vh轻松搞定三栏布局固定头尾、中间滚动?用Flex vh轻松搞定三栏布局引言:为什么页面头尾固定这么让人头疼CSS Flex 布局快速上手指南——从“ Flex 是谁”到“ Flex 是我兄弟”1. 激活 Flex 模式2. 主轴与交叉轴—…

作者头像 李华
网站建设 2026/3/4 16:52:12

微电网恒功率PQ控制策略下的LCL并网仿真研究

微电网恒功率PQ控制,LCL并网仿真最近在搞微电网并网控制时发现个有意思的事——并网逆变器的PQ控制策略和LCL滤波器配合使用时,参数整定能把人绕晕。今天咱们就手撕个MATLAB仿真,看看这个经典组合到底怎么玩。先说说控制逻辑的核心&#xff1…

作者头像 李华
网站建设 2026/3/8 13:18:19

【青岛理工】25年计网期末A卷回忆版

一、简答题43分1.TCP/IP协议体系结构各层的核心功能2.简述CDMA的工作原理,计算过程见PPT/作业对于CDMA原理的理解,这里附上我在学习的时候自己的想法和思考(仅供参考,并非教科书式权威的理解):考虑&#xf…

作者头像 李华
网站建设 2026/3/6 10:08:28

51单片机数字电压表

51单片机的数字电压表(数码管显示)–可提供C程序、proteus仿真、原理图、PCB、元件清单 功能说明 主要由51单片机最小系统、四位共阴数码管、ADC0832模数转换芯片组成。 可测DC5V以内的电压,显示精度为0. 001V玩单片机的小伙伴应该都想过自己做个电压表吧&#xff1…

作者头像 李华