最详细的微信商城小程序搭建教程!

你好，我是陆俊坤。

从今天起，我将在头条上持续分享100期有价值和有意义的赚钱技能，内容包括小程序开发、网站建设、流量主变现、全平台引流、短视频创业、AI工具使用以及一些赚钱风向。每一期内容都是俊坤原创，保证干货满满，同时我会用大量的图文和视频，细化每一个步骤，让你看完就能上手操作，逐渐帮助你掌握至少100个新的赚钱技能。

今天是01期，分享内容为微信商城小程序搭建的详细攻略。相信我，只要你按照教程来操作，也能轻松制作出一个属于自己的微信商城小程序。本期内容较多，为防迷路，建议收藏。

搭建须知

01版权信息

本套商城小程序源码为官方开源版本，可免费商用，无版权风险，所以放心大胆冲。

02硬件设施

搭建小程序需要使用到微信开发者工具，你至少需要准备一台电脑，无配置要求。

03基础费用

你需要购买一台服务器（约80元），注册一个域名（约20元），线上支付功能需完成小程序认证（个体工商户30元、企业300元）。

搭建步骤

01前期准备

1. 服务器购买。
2. 服务器配置。
3. 域名注册及备案。
4. 宝塔面板安装。
5. 小程序注册、备案及认证。
6. 微信商户支付账号注册及使用。

02后端搭建

1. 域名解析。
2. 新建站点。
3. 上传后端源码。
4. 设置运行目录。
5. 申请SSL证书。
6. 后台程序安装。

03后台配置

1. 合法域名设置。
2. 小程序APPID及秘钥配置。

04前端搭建

1. 下载HBuilderX。
2. 导入前端源码。
3. 修改域名网址。
4. 获取应用标识。
5. 填写小程序APPID。
6. 下载微信开发者工具。
7. 打包发行微信小程序。
8. 上传源码。

05审核发布

1. 设置小程序类目。
2. 提交审核。
3. 发布小程序。

PS：步骤看起来虽多，但其实非常简单。因为我怕你学不会，所以把一些步骤又进行了详细拆解。别怕，跟上我的节奏，一起进入实操环节。

前期准备1：服务器购买

01进入腾讯云官网

服务器可以在阿里云或腾讯云选购，这里以腾讯云为例，直接用浏览器搜索“腾讯云”，点击进入官网。

02注册并账号实名

在官网右上角点击“免费注册”，完成后进行实名认证。

03进入活动专场

腾讯云官网经常在做活动，新人能以非常优惠的价格买到配置不错的服务器。在官网左上角点击“最新活动”，进入活动专场。

04服务器选择

这里我们选择“轻量应用服务器”，相对云服务器来说性价比更高。配置2核2G3M或2核2G4M就行，价格一般在100元以内，注意要选择“时长”为“自购买1年内有效”的，然后点击购买。

05配置选择

“地域”随便选择一个，“镜像”选择“CentOS Stream 8”，然后点击“立即购买”。

前期准备2：服务器配置

01进入服务器面板

在腾讯云官网首页右上角进入“控制台”，从“我的资源”中找到服务器，点击进入。

02放行端口

需要放行2个端口，3306是数据库端口，8888是宝塔面板端口。点击“防火墙”，再点击“添加规则”。只需要填写两个地方，“来源”填写“0.0.0.0/0”，端口填写“3306”和“8888”。

03重置服务器密码

在服务器“概要”下方，找到“重置密码”。密码组成为大写+小写+数字+符号其中至少3项，修改的密码一定要保存好，一定要保存好，一定要保存好，重要的事情说三遍。

前期准备3：域名注册及备案

01创建域名信息模板

在控制台下方搜索“域名注册”，进入域名管理后台。点击“信息模板”，选择“新建模板”，填写相关信息后，提交审核。（审核时间5分钟左右）

02注册域名

域名格式为XXXX.YY。XXXX为自己自定义的数值，可以是字母、数字或者组合，YY为域名类型，常见的有com、cn、net等。在域名管理后台“概览”中，找到域名注册框，填写你想要注册的域名，点击查询，查看域名是否被注册。然后选择一个未被注册的域名，添加购物车后支付。这里推荐大家购买cn类型，低价可以选择online类型。

03域名备案

域名注册后是不能直接使用的，需要完成备案才能接入网络。在网站首页右上角找到“备案”，点击“开始备案”，然后按照指引填写个人相关信息，提交审核即可。为了方便过审，网站名称建议填写“个人笔记”，备注填写“用于记录个人日常生活、学习中的美好点滴等信息”，越简单越好，不要出现“用户、服务”等字段。管局将在20个工作日内进行审核，一般情况下7个工作日即可完成。大家在等待域名备案期间，也可以联系我，领取一个已备案的域名进行练习，先完整跑完整个搭建流程。

前期准备4：宝塔面板安装

01新手扫盲

服务器主要用于数据存储及运行，相当于一台云端的电脑。域名则是相当于一个网络地址。宝塔面板相当于一个工作台，我们今后搭建小程序或者网站，都可以通过这个工作台来操作。

02进入宝塔面板官网

使用浏览器搜索“宝塔面板”进入官网，在首页点击“立即免费安装”。选择Linux面板，点击“在线安装”。

03进入安装环节

填写服务器IP和密码（之前修改的密码），点击“立即安装到服务器”，然后等待安装，期间不要关闭网页。（安装时间约5分钟）

PS：服务器IP获取方式：进入腾讯云控制台，找到服务器页面复制即可。

04登录宝塔面板

安装完成后，会获得宝塔面板的网址、账号和密码。听好：新建一个文档保存起来。然后把网址复制到浏览器打开，填写账号密码登录面板。

到此，先祝贺你，你现在已经拥有了一个属于自己的工作台，今后你可以在这个工作台上大展拳脚，搭建和管理不同类型的小程序或者网站。

05知识拓展

很多人不知道网站是怎么搭建起来的，这里给大家简单拓展一下：我们可以通过宝塔面板新建一个站点，然后把你注册的域名添加进去，这样就能够创建一个没有内容的网站了，是不是简单又有趣？

前期准备5：小程序注册、备案及认证

01小程序注册

浏览器搜索“微信公众平台”，在首页右上角点击“立即注册”，注册类型选择“小程序”，账号主体选择企业（含个体工商户）。个人类型的小程序不能开通支付功能，所以如果你没有营业执照，就选个人主体搭建出来玩玩，以后再用这个账号搭建一些流量主的小程序赚点广告费。注册这块比较简单，按照指引填写相关信息提交即可。

02小程序信息完善

注册完成以后登录，填写小程序信息，包括名称、头像和介绍。类目先不用管，不同类型的小程序，类目也不同。

03小程序备案

填写相关信息提交审核即可，可以参照域名备案，信息填写越简单越好。审核时间2-3天。

04小程序认证

企业认证费用300元，个体户和个人主体30元。认证以后才能开通线上支付功能。填写相关信息提交审核即可，期间会接到官方电话核对信息，注意接听。认证时间1-2天。

前期准备6：微信商户支付账号

01账号注册

使用浏览器搜索“微信商户支付平台”，在首页右上角点击“接入微信支付”，选择“注册微信商户支付号”。

02填写注册信息

填写姓名、营业执照等信息后提交。

03开通支付产品

注册完成后，进入“产品中心”，开通3个支付产品。

04设置APIv3秘钥

从“账户中心”进入API安全页面，点击设置APIv3秘钥。设置一个32位的秘钥 (数字和大小写字母)，妥善保管并且不要泄露给他人，后期会用到。

05申请新证书

从“账户中心”进入API安全页面，找到“管理证书”，点击“申请新证书”，按照指引下载证书工具。

06下载证书文件

在证书工具中填写商户号和企业名称，获得请求串，将请求串复制粘贴到网页中，获得证书串，将证书串复制粘贴到证书工具中，提示证书申请成功，生成了一个zip压缩文件，打开是3个证书文件。

PS1：这里有点绕，别怕，我给你解释：但其实很简单，就是一个网页和工具相互验证密码并匹配的过程。

PS2：这三个证书和上面的32位秘钥，就是我们对接微信支付的关键，在小程序后台填写上传即可完成对接。

后端搭建1：域名解析

01二级域名介绍

前面我们讲过域名格式为XXXX.YY，解析时我们只需要在域名前加上AA.。解析出来的二级域名格式就是AA.XXXX.YY。AA可以自定义，所以一个域名，能够解析出无数个二级域名。我们后面搭建小程序或网站，都需要解析不同的二级域名。

02二级域名解析

在腾讯云官网首页右上角进入“控制台”，点击“域名注册”进入管理面板。找到“我的域名”，点击“解析”。主机记录就是自定义的数值，记录值是你的服务器IP地址。

后端搭建2：新建站点

01宝塔环境

登录宝塔面板，在左侧导航找到“软件商店”，搜索安装数据库5.6和PHP7.4版本。同时在PHP中安装拓展fileinfo redis。

02宝塔添加站点

在腾讯云官网首页右上角进入“控制台”，点击“域名注册”进入管理面板。找到“我的域名”，点击“解析”。主机记录就是自定义的数值，记录值是你的服务器IP地址。

02宝塔新建站点

打开宝塔面板，点击“网站”，选择“添加站点”，填写解析的二级域名，数据库版本选择5.6，PHP版本选择7.4。

后端搭建3：上传后端源码

01删除默认文件

点击网站根目录，删除后默认文件。

02上传源码

在根目录下点击“上传”，选择后端源码文件，上传后进行解压。（需要源码的朋友请在评论区扣“源码”，然后找我领取即可）

后端搭建4：设置运行目录

01进入站点管理

在左边导航点击“网站”，再点击二级域名。

02网站目录设置

点击“网站目录”，将“运行目录”设置为“/public”，然后保存。

后端搭建5：申请SSL证书

01进入站点管理

在左边导航点击“网站”，再点击二级域名。

02申请免费证书

点击“SSL”，选择“Let' Encrypt”，勾选你的域名，点击“申请”。申请成功后，勾选“强制HTTPS”，然后保存。免费申请的证书90天一签，超时前来宝塔面板续签即可。

后端搭建6：后台程序安装

01获取数据库名、用户名和密码

在宝塔面板左侧点击“数据库”，可以复制数据库名、用户名和密码。默认情况下，数据库名和用户名是一样的。

02开始安装后台

在左边导航点击“网站”，再点击二级域名，进入后台安装。

03填写数据库名、用户名和密码

在后台安装页面填写数据库名、用户名和密码，然后点击“开始安装”。

04进入后台管理

安装成功后，即可跳转到商城小程序控制后台，在后台可以进行店铺装修、商品上架等功能设置。后台地址为https://www.你的域名.com/admin，默认账号admin，密码yinghuo，可在后台自行修改。

后台配置1：合法域名设置

01登录微信公众平台

在浏览器搜索“登录微信公众平台”，扫码进入小程序设置界面。在左边导航栏点击“开发管理”。

02修改服务器域名

在开发管理中，找到服务器域名，填写为你的二级域名。

后台配置2：小程序Appid和密钥

01获取小程序Appid和密钥

在“微信公众平台”左边导航栏点击“开发管理”，可以看到小程序的Appid，相当于小程序的身份证。点击“生成”，可以生成小程序密钥。

02设置小程序Appid和密钥

在登录商城小程序管理后台，点击“小程序设置”，将获取的小程序Appid和密钥复制粘贴在此。

前端搭建1：下载Hbuilderx

在浏览器搜索“Hbuilderx”，点击下载安装即可。安装完成后打开Hbuilderx工具。

前端搭建2：导入前端源码

在HBuilderX顶部菜单栏点击“文件” ，点击“导入” ，选择“从本地目录导入”，导入商城小程序前端源码文件。

前端搭建3：修改域名网址

点击前端源码中的config.js文件，找到里面的apiUrl项，填入你自己的二级域名，并保存文件。

前端搭建4：获取应用标识

点击前端源码中的manifest.json文件，选择基础配置，重新获取uni-app应用标识。

前端搭建5：填写小程序Appid

点击前端源码中的manifest.json文件，选择微信小程序配置，修改为你的小程序Appid。

前端搭建6：下载微信开发者工具

浏览器搜索“微信开发者工具”，选择稳定版进行下载安装。安装完成后，微信扫码登录。

前端搭建7：打包发行微信小程序

在HBuilderX工具顶部菜单栏点击“发行”-，选择发行“岛小程序-微信”。等待一段时间后，会自动跳转打开微信开发者工具。

前端搭建8：上传源码

微信开发者工具打开后，点击“编译”，如果左侧能够正常显示小程序页面，说明我们之前搭建没有问题，点击“上传”。

审核发布1：设置小程序类目

到这一步，我们的小程序已经基本部署完成，现在只需要设置一下小程序的类目，然后提交审核就可以了。登录微信公众平台，在左侧导航栏找到“设置”，选择小程序的类目就行。根据你商城的主营产品来选择对应的类目就行。

审核发布2：提交审核

在微信公众平台左侧导航栏找到“版本管理”，我们从微信开发者工具上传的源码会出现在“开发版本”这里，直接点击“提交审核”就行。每个小程序每年有一次加急审核的机会，勾选后官方会在两个小时内完成审核。如果审核没通过，就按照官方的指引修改后重新提交即可。

审核发布3：发布小程序

审核通过后，官方会通过微信向我们发送信息。然后登录微信公众平台。在版本管理中找到审核版本，点击发布就行。

写在最后

到此，恭喜你，你拥有了一个属于自己的微信商城小程序，也掌握了一个新的赚钱技能。今后，你也可以通过宝塔面板，尝试搭建更多不同类型的小程序或者网站，推开一扇有趣又有意义的大门。

好了，本期内容到此结束，如果你在搭建过程中有什么问题，欢迎随时与我进行交流，一起学习进步！