如何搭建微信小程序?本文通过云服务器ECS和云数据库RDS快速部署博客网站服务,利用云解析DNS将域名请求解析到ECS上所部署的网站服务,将SSL证书部署至ECS服务器,实现以HTTPS协议与网站服务进行数据加密通信,在微信开发者工具中通过网站暴露的服务进行用户界面开发,实现微信小程序中博客网站的快速搭建。
【部署教程】搭建微信小程序
本文部署时间大约需要10分钟,假设你没有购买云服务器ECS和云数据库,本文以按量付费计费模式为例,预估费用是1.044元/小时。会使用到阿里云服务器ECS和云数据库:
- 云服务器ECS:https://www.aliyun.com/product/ecs
- 云数据库RDS:https://www.aliyun.com/product/rds
- 其他云产品:如域名、SSL证书等费用不在预算内,一般购买一个阿里云cn域名价格是35元一年,com域名是95元一年,SSL证书可以使用免费SSL。
微信小程序方案架构
方案提供的默认设置完成部署后在阿里云上搭建的网站运行环境如下图所示。实际部署时您可以根据资源规划修改部分设置,但最终形成的运行环境与下图相似。
说明:当前部署架构为单机部署,主要用于解决方案场景演示,存在单点故障问题,如果存在高可用性要求,可以在多可用区进行分布式部署。
本方案的技术架构包括以下基础设施和云服务:
- 域名:一个已经完成备案的域名。
- 数字证书管理服务:一个 SSL 证书用于实现 HTTPS 加密通信。
- 云解析 DNS:将用户访问网站的域名请求解析到云服务器。
- 专有网络 VPC:一个专有网络,构建云上私有网络。
- 云服务器 ECS:一台云服务器用于部署博客网站服务。
- 云数据库 RDS:一个云数据库 RDS MySQL 实例,为博客网站提供数据服务。
部署准备
开始部署前,请按以下指引完成账号申请、账号充值等准备工作。
准备账号
- 如果您还没有阿里云账号,请访问阿里云账号注册页面,点击右上角【立即注册】根据页面提示完成注册。阿里云账号是您使用云资源的付费实体,因此是部署方案的必要前提。
- 为阿里云账号充值。本方案的云资源支持按量付费,且默认设置均采用按量付费引导操作。如果确定任何一个云资源采用按量付费方式部署,账户余额都必须大于等于100元。
可用权益
- 免费试用(仅限新用户)
- 学生用户请领取实验所需的云资源(额度300元)
- 云服务器ECS“99计划”(原价1507.56元/年,现价99元/年,新老同享,续费同价)
通过Terrafrom模板快速部署
通过 Terraform 模板,您可以实现阿里云资源的自动部署。模板以代码形式描述基础设施及其架构,能够自动完成云上资源的创建与配置,显著提升部署效率。本方案提供的 Terraform 模板将自动创建并配置以下资源:
- 一个专有网络VPC,构建云上私有网络。
- 一台交换机VSwitch,提供基本的网络分段和隔离功能。
- 一台云服务器ECS,搭建了一个基于WordPress的博客网站,开启了REST API以便与客户端进行数据交互,并安装了 JWT 插件用于身份验证和鉴权。
- 一个云数据库RDS MySQL实例,为博客网站提供数据服务。
操作步骤
说明
如果您希望在已有的 Terraform 环境中部署方案,可先下载Terraform 模板文件,然后通过 Terraform 命令手动完成部署。
- 打开部署链接前往阿里云控制台,系统自动打开使用新资源创建资源栈的面板。
- 在顶部菜单栏选择华东1(杭州)地域。您也可以根据实际需求选择其他地域。
- 在配置参数页面完成以下配置后,单击下一步:检查并确认。
配置项 |
参数 |
说明 |
示例值 |
网络配置 |
专有网络网段 |
服务所在的网络网段。 |
192.168.0.0/16 |
交换机子网网段 |
服务所在的子网网段。 |
192.168.0.0/24 |
|
可用区ID |
服务所在的可用区。 |
可用区 J |
|
ECS配置 |
实例类型 |
ECS实例的架构、分类和规格配置。 |
ecs.e-c1m2.large |
实例密码 |
ECS实例的密码。 |
||
RDS配置 |
实例规格 |
云数据库RDS实例的规格。 |
mysql.n2m.medium.2c |
数据库名称 |
创建的数据库名称。 |
||
RDS数据库账号 |
RDS实例的数据库账号和密码。 |
||
RDS数据库密码 |
|||
WordPress配置 |
WordPress用户名 |
WordPress管控后台管理账号用户名、密码和用户邮箱。 |
|
WordPress密码 |
|||
WordPress用户邮箱 |
|||
- 在资源配置预览页面,确认模板参数以及费用之后,单击创建。
- 当资源栈信息页面的状态显示为创建成功时表示一键配置完成。
- 在资源栈管理页面,单击输出页签,复制并记录输出关键字为
web_url所对应的值,其为示例业务系统访问地址。
小程序开发
- 小程序开发准备。
- 进入小程序页面,单击前往注册,根据指引填写信息并提交相应的资料,完成账号申请。
- 使用申请的微信公众平台账号登录小程序后台,单击开发与服务>开发管理>开发设置,记录小程序的AppID,后续操作中需要使用。
- 进入开发者工具下载页面,下载稳定版安装包进行安装。
说明
小程序开发工具在 Windows 上仅支持 Windows 7 及以上版,在 Mac 上支持 OS X 10.8 及以上版本。
- 创建个人博客小程序项目并进行本地调试。
- 在前端代码仓库页面,单击下载Zip或者通过Git下载代码至本地。
- 打开开发者工具,单击菜单栏中项目>导入项目,选择上一步下载的小程序项目代码所在的根路径,单击选择。
- 在导入项目配置页面,将上一步获取的 AppID 进行设置,其余配置保持默认,单击创建。
- 打开小程序项目配置文件
miniprogram/config.ts,将常量BLOG_HOST、ADMIN_ACCOUNT和ADMIN_PASSWORD的值分别替换为http://<IP>(其中<IP>为ECS公网IP地址),WordPress 管控后台登录账号和密码。
说明
建议使用应用程序密码(Application Passwords),应用程序密码用于为第三方应用和服务提供一种安全且便捷的方式来进行身份验证,可以在不影响主账户安全的情况下重置或撤销单个应用的访问权限,这有效地提高了安全性,同时便于应用的集成和管理。 - 在工具栏中单击 真机调试图标,会对整体项目进行编译并构建生成一个二维码,使用微信扫描二维码之后就可以在微信上测试小程序。
说明
使用模拟器模拟客户端逻辑和界面表现时,由于存在系统差异以及微信客户端特有的一些交互逻辑,少部分API无法在模拟器上进行模拟,此时需要在真机环境进行调试。
发布上线(可选)
说明
如果您仅想体验方案,无需申请域名和备案,可以跳过此步骤。
当完成小程序开发并且测试通过之后,开始对小程序进行发布。小程序发布的前提条件包括:
- 不能使用IP地址,需要使用独立域名,且域名必须经过 ICP 备案。
- 域名只支持 HTTPS 和 WSS 协议。
方案验证
通过小程序开发工具模拟器,验证博客列表以及博客内容是否可以正常查阅。
|
|
当您完成 JWT 插件安装(一键部署默认已安装)之后,可以在小程序端实现内容创作。在模拟器底部菜单切换至我的,单击游客图标,在登录页面点击立即注册,通过页面引导完成新用户注册并登录,在底部菜单我的点击立即创作,在内容编辑器中创作并发布。
|
|
更多关于域名申请及备案、域名解析DNS、SSL证书配置等操作,请移步到官方文档页面:https://help.aliyun.com/zh/ecs/user-guide/develop-your-wechat-mini-program-in-10-minutes