一、引言
微信小程序以其轻量、便捷和无需下载安装的特点,迅速成为移动互联网的一大趋势。通过阿里云的支持,可以更加高效地开发和部署微信小程序。本教程提供在阿里云云服务器ECS上基于Alibaba Cloud Linux 3.2104 LTS 64位操作系统搭建小程序服务端的指引。同时指导您在本地开发一个简单的微信小程序——ECS小助手,通过远程调用部署在ECS上的服务端,实现在小程序中输入框输入ECS实例ID查询实例详细信息的功能。
二、开通云服务器ECS免费试用
在实验室页面下方,选择任意一个免费试用规格的云服务器ECS,单击立即试用。
在云服务器ECS面板,根据如下说明完成参数配置,选中协议,单击立即试用,如弹出新的页面,您可先忽略。本试用教程以下列的配置信息为例,实际操作时,建议根据您的实际业务体量和需求选择。
前往ECS控制台,在左侧导航栏,选择实例与镜像 > 实例。
在顶部菜单栏左上角处,本实验中地域选择华东1(杭州)。
设置该实例登录密码。找到您创建的试用实例,在其右侧操作列单击> 实例属性 > 重置实例密码,按照界面提示设置ECS实例的登录密码。
单击试用实例的ID,选择安全组页签,单击安全组操作列的配置规则,在入方向添加需要放行的端口。本教程中,在安全组入方向放行80、443、22、3389端口。
三、一键配置
打开一键配置模板链接前往ROS控制台,系统自动打开使用新资源创建资源栈的面板,并在模板内容区域展示YAML文件的详细信息。
ROS控制台默认处于您上一次访问控制台时的地域,请根据您创建的资源所在地域修改地域。确认好地域后,保持页面所有选项不变,单击下一步进入配置模板参数页面。
在配置模板参数页面修改资源栈名称,选择您刚刚创建的ECS实例,并设置要创建的用于ECS实例扮演的角色名称。填写完所有必选信息并确认后单击创建开始一键配置。
当资源栈信息页面的状态显示为创建成功时表示一键配置完成。
四、注册微信小程序
进入小程序页面,单击前往注册,根据指引填写信息和提交相应的资料,点击注册,完成账号申请。
使用申请的微信公众平台账号登录小程序后台,单击开发管理> 开发设置,可以看到小程序的AppID,请记录AppID,后续操作中需要使用。
五、安装小程序开发环境并创建项目
启动好后端服务后,我们接下来要开发小程序。先安装小程序开发环境。
安装Node.js开发环境,请到Node.js页面下载并安装Node.js环境。
下载并安装微信小程序开发工具。详细信息请参见开发工具下载。
打开小程序开发工具,使用微信扫码登录。
单击加号创建微信小程序示例项目。
参考以下填写项目信息,最后单击新建。
项目名称:例如ECSAssistant。 目录:例如D:\workspace\wechat\ECSAssistant。 AppID:小程序的唯一标识,从小程序控制台获取。 开发模式:小程序。 后端服务:不使用云服务。 模板选择:TS-基础模板
6. 配置项目允许访问非HTTPS域名。在顶部配置栏,选择设置>项目设置,在本地设置页签,选中不校验合法域名、web-view(业务域名)、TLS版本一级HTTPS证书。
六、开发小程序
安装好开发环境后,我们来编写小程序代码。
生成的的小程序示例项目结构如下。可以看到小程序的项目结构中有三种前缀为app的文件,它们定义了小程序的一些全局配置。
app.json 应用配置。用于配置小程序的页面列表、默认窗口标题、导航栏背景色等。更多信息,请参见全局配置。 app.acss 应用样式。定义了全局样式,作用于当前小程序的所有页面。 app.js 应用逻辑。可配置小程序的生命周期,声明全局数据,调用丰富的API。
小程序所有的页面文件都在pages/路径下,页面文件有四种文件类型,分别是.ts、.wxml、.wxss、和.json后缀的文件。相比全局配置文件,页面配置文件只对当前页面生效。其中.wxml文件定义了当前页面的页面结构。小程序中的所有页面都需要在app.json文件中声明。更多信息,请参见代码构成。
此外,项目顶层还有开发工具配置文件project.config.json和爬虫索引文件sitemap.json。
编辑app.json文件,将小程序页面Title修改为ECS小助手。
编辑pages/index/index.wxss文件,定义index的页面样式。
编辑pages/index/index.ts文件,定义搜索框的失去焦点事件。
编辑pages/index/index.wxml文件,编写展示界面。
保存后,编辑器会自动刷新。看到如下界面,表示小程序运行成功了。
七、清理
ECS提供的试用实例有按量付费实例和包年包月实例。请在阿里云免费试用确认您试用的实例类型,并参考以下规则清理:
如果无需继续使用实例,可以登录ECS控制台,找到目标实例,在操作列单击,搜索并单击释放设置,根据界面提示释放实例。 如果需要继续使用实例,请至少在试用到期1小时前为阿里云账号充值,确保账户金额不小于100.00元人民币。到期未续费的实例会因欠费而被自动停机,停机15天内实例将保留,15天后实例和数据都将被自动释放。 包年包月实例到期会自动释放,释放实例的同时释放数据。 如果需要继续使用实例,请在试用到期前及时续费。到期未续费的实例会因欠费而被自动停机,停机15天内实例将保留,15天后实例和数据都将被自动释放。
八、后续
如果您期望上线您的小程序,您需要做下面几件事:
申请域名,可以参考域名注册基本流程如何注册阿里云域名。 申请SSL证书,并配置到服务器上,可以参考申请免费DV单域名试用证书。 上传小程序并提交审核,可以参考小程序发布上线。 待审核通过后,手动上线小程序,就可以在微信客户端中查看和使用小程序了。
九、使用ECS搭建微信小程序,最高赢小米路由器
想必你通过实操,已经学会如何利用阿里云ECS高效地搭建和部署微信小程序。现在邀请你来到阿里云开发者社区参加“搭建微信小程序”活动,领取免费试用云资源,跟随教程完成小程序搭建并发布小程序实验作品,即可领取柠檬电子秤,限量300个。邀请好友一起参加活动,有机会赢取小米路由器。
点击阅读原文,搭建微信小程序~