基于 Spring Boot 创建部署云应用 Todo App
本文介绍如何基于 Spring Boot 技术栈创建并部署一个简单的 Todo App 应用程序。
前提条件
- 您拥有支付宝账号
- 您已 申请 开通小程序开发者权限
- 您已 开通云服务
- 已下载安装 IntelliJ 小程序开发插件
- 已下载安装 小程序开发者工具
操作步骤
整个操作流程分为以下 6 步:
创建小程序
- 登录 蚂蚁金服开放平台,选择 开发者中心 > 小程序 > 创建。
- 填写 基本信息,点击 创建 按钮,创建应用名为 示例应用 小程序。
说明:一个账号下最多可以创建10个小程序;未提交过审核的小程序可以删除,删除的小程序不在计数范围。
创建云应用后端服务
- 在 我的小程序 页面,选择刚创建的小程序,点击 查看,进入 开发管理 页面。
- 点击左侧导航栏的 云服务(公测),在 云服务列表 页面点击 创建云服务 > 创建云应用。
- 在 创建云应用 页面,选择 SpringBoot 技术栈,填入 应用名称 和 描述 (选填),点击 创建。
构建环境
- 返回 云服务 页面,点击刚创建的云服务卡片中的 构建环境 按钮。
- 在 购买环境资源 页面,选择合适的环境配置方案,点击 同意《产品服务协议》 > 确认配置。
说明:此处选择 小程序云应用入门(Mysql版),当前测试环境该方案免费提供,但若连续 7 日未部署过代码,环境会被自动回收。
- 在 订单详情 页面,点击 确认购买。购买成功后会自动进入 构建环境 页面。构建过程会耗时几分钟,构建成功后,您可以选择 查看应用详情 ,或者 返回应用列表 。
数据准备
在 云应用详情 页面,选择 数据库 页签,点击查看 Web 控制台,登录后进入 PhpMyAdmin 的数据库管理页面。(数据库自带admin账户,admin账户的初始密码可点击 数据库 标签页中的眼睛图标()查看,可使用admin账户登录PhpMyAdmin )
在页面左侧,选中 sample 数据库中,新建表 task,
task表的数据结构如下图。
请确保您新建的表结构与图中完全一致,否则示例程序可能无法运行,注意:字段名称、 字段类型、 id 字段为主键且自增(A_I)、 done 字段默认值为 0、各字段是否允许空值。点击 保存,完成创建该示例程序所需的数据库表。
除了如上所述创建表的操作,您也可以通过执行以下 SQL 语句创建task表。
USE sample; CREATE TABLE `task` (`id` bigint(20) NOT NULL AUTO_INCREMENT,`label` varchar(140) CHARACTER SET utf8 DEFAULT NULL,`done` tinyint(1) NOT NULL DEFAULT '0',`img_url` varchar(256) CHARACTER SET utf8 DEFAULT NULL,`user_id` varchar(50) CHARACTER SET utf8 DEFAULT NULL,PRIMARY KEY (`id`)) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8;
开发云应用后端服务
打开 IDEA > 新建项目,选择 AntCloud Initializer 应用,选择 SpringBoot 下的 Todo App Java 版,点击 Next。
填写项目名(Project name),点击 Finish 完成项目创建。
说明:Todo App 应用示例演示了小程序服务端 SDK 使用(参见类 UserController),数据库增删改查(参见类 TaskController),文件上传下载(参见类 UploadController)等功能。后端代码结构如下图。其中,包 controller 是 Web 接口层代码,service 是服务层代码,dal 是数据访问层代码。controller 层使用 resteasy 作为 jax-rs 框架实现。dal 层使用 Hibernate 作为 JPA 实现。代码的具体实现请参看项目中的代码注释。
打开 src/resources/application.properties 文件,填入服务运行所需的参数。
其中,应用域名(demo.domain)和数据库地址可从云应用 web 控制台的应用详情页获得。小程序的应用密钥可参考文档 《生成RSA密钥》 获得。使用 RSA密钥生成工具生成 PKCS8 格式的私钥、公钥后,将私钥内容写为 application.privateKey 的值,再将公钥设置到开放平台(具体过程可参考文档《上传应用公钥并获取支付宝公钥》),最后将生成的支付宝公钥内容写为 application.publicKey 的值。
重要:要使用小程序服务端 SDK 获取用户信息,小程序 > 开发管理 > 功能列表 中,必须添加 获取会员信息 功能。
运行类 com.alipay.demo.Application
,HTTP 访问本地端口 http://localhost:8080/todos
返回(空的)待办事项列表,则说明程序运行成功。
本地调测程序成功后,即可将程序发布到云应用服务的云服务器。选择 View > Tool**Windows > AntCloud,打开 小程序云应用** 视窗。
通常情况下, 小程序云应用 视窗会显示在 IDEA 界面的下方。
在 小程序云应用 视窗中,点击 登录账号 ,通过扫描二维码登录支付宝账户。
点击 关联小程序,选择刚创建的云应用 SpringBootDemo,并关联到当前工程。
关联云应用后,可在 小程序云应用 视窗中查看关联的云应用详情。
在 小程序云应用 视窗中,点击 云应用管理,在弹出的操作界面中,点击 部署云应用 。
在弹出的 部署云应用(本地构建) 的操作界面。点击 本地构建,工程会被打包成 JAR 包。
点击 部署应用 将该打包好的项目 JAR 包部署到测试环境上。
开始部署后,云应用管理 视窗会打出部署日志。部署结束后会有消息提示部署完成。
开发小程序前端界面
打开 小程序开发者工具,在菜单中选择 项目 > 新建项目。
选择模板:选择 Todo 云应用-NodeJS 示例 ,点击 下一步。(NodeJS和Spring Boot的demo用的是同一套前端代码,因此 Todo 云应用-NodeJS示例 模板也可用于演示基于 Spring Boot 的云应用)
选择云服务:填写项目名称,选择项目路径。由于后端服务在 IDEA 中开发完成,此处勾选 不启用云服务 。点击 完成,进入编码。关于前端代码的详细介绍请参看 文档。
在左侧导航栏,选择 云服务 图标,并关联应用。不需要选择云服务。
运行程序前,需修改 client/app.js 文件中的变量 demoDomain(请求后端服务的域名/IP 地址)的值为您的云应用服务的域名。
项目编译后,即可从 IDE 右侧看到渲染的界面。
点击 IDE 右上角的 上传 按钮将小程序上传到开放平台。上传完毕后,登录到开放平台提交审核,审核完毕后,小程序即可进行发布操作。