个人博客导航页(点击右侧链接即可打开个人博客):大牛带你入门技术栈
作为一名前端开发者,在选择 Nodejs 后端服务框架时,第一时间会想到 Egg.js,不得不说 Egg.js
是一个非常优秀的企业级框架,它的高扩展性和丰富的插件,极大的提高了开发效率。开发者只需要关注业务就好,比如要使用 redis
,引入 egg-redis 插件,然后简单配置就可以了。正因为如此,第一次接触它,我便喜欢上了它,之后也用它开发过不少应用。
有了如此优秀的框架,那么如何将一个 Egg.js
的服务迁移到 Serverless
架构上呢?
背景
我在文章 基于 Serverless Component 的全栈解决方案 中讲述了,如何将一个基于 Vue.js
的前端应用和基于 Express
的后端服务,快速部署到腾讯云上。虽然受到不少开发者的喜爱,但是很多开发者私信问我,这还是一个 Demo
性质的项目而已,有没有更加实用性的解决方案。而且他们实际开发中,很多使用的正是 Egg.js
框架,能不能提供一个 Egg.js
的解决方案?
本文将手把手教你结合 Egg.js
和 Serverless
实现一个后台管理系统。
读完此文你将学到:
- Egg.js 基本使用
- 如何使用 Sequelize ORM 模块进行 Mysql 操作
- 如何使用 Redis
- 如何使用 JWT 进行用户登录验证
- Serverless Framework 的基本使用
- 如何将本地开发好的 Egg.js 应用部署到腾讯云云函数上
- 如何基于云端对象存储快速部署静态网站
Egg.js 入门
初始化 Egg.js 项目:
$ mkdir egg-example && cd egg-example
$ npm init egg --type=simple
$ npm i
启动项目:
$ npm run dev
然后浏览器访问 http://localhost:7001
,就可以看到亲切的 hi, egg
了。
关于 Egg.js 的框架更多知识,建议阅读 官方文档
准备
对 Egg.js 有了简单了解,接下来我们来初始化我们的后台管理系统,新建一个项目目录 admin-system
:
$ mkdir admin-system
将上面创建的 Egg.js 项目复制到 admin-system
目录下,重命名为 backend
。然后将前端模板项目复制到 frontend
文件夹中:
$ git clone https://github.com/PanJiaChen/vue-admin-template.git frontend
说明: vue-admin-template 是基于 Vue2.0 的管理系统模板,是一个非常优秀的项目,建议对 Vue.js 感兴趣的开发者可以去学习下,当然如果你对 Vue.js 还不是太了解,这里有个基础入门学习教程 Vuejs 从入门到精通系列文章
之后你的项目目录结构如下:
.
├── README.md
├── backend // 创建的 Egg.js 项目
└── frontend // 克隆的 Vue.js 前端项目模板
启动前端项目熟悉下界面:
$ cd frontend
$ npm install
$ npm run dev
然后访问 http://localhost:9528
就可以看到登录界面了。
开发后端服务
对于一个后台管理系统服务,我们这里只实现登录鉴权和文章管理功能,剩下的其他功能大同小异,读者可以之后自由补充扩展。
1. 添加 Sequelize 插件
在正式开发之前,我们需要引入数据库插件,这里本人偏向于使用 Sequelize ORM 工具进行数据库操作,正好 Egg.js 提供了 egg-sequelize 插件,于是直接拿来用,需要先安装:
$ cd frontend
# 因为需要通过 sequelize 链接 mysql 所以这也同时安装 mysql2 模块
$ npm install egg-sequelize mysql2 --save
然后在 backend/config/plugin.js
中引入该插件:
module.exports = {
// ....
sequelize: {
enable: true,
package: "egg-sequelize"
}
// ....
};
在 backend/config/config.default.js
中配置数据库连接参数:
// ...
const userConfig = {
// ...
sequelize: {
dialect: "mysql",
// 这里也可以通过 .env 文件注入环境变量,然后通过 process.env 获取
host: "xxx",
port: "xxx",
database: "xxx",
username: "xxx",
password: "xxx"
}
// ...
};
// ...
2. 添加 JWT 插件
系统将使用 JWT token 方式进行登录鉴权,安装配置参考官方文档,egg-jwt
3. 添加 Redis 插件
系统将使用 redis 来存储和管理用户 token,安装配置参考官方文档,egg-redis
4. 角色 API
定义用户模型,创建 backend/app/model/role.js
文件如下:
module.exports = app => {
const { STRING, INTEGER, DATE } = app.Sequelize;
const Role = app.model.define("role", {
id: { type: INTEGER, primaryKey: true, autoIncrement: true },
name: STRING(30),
created_at: DATE,
updated_at: DATE
});
// 这里定义与 users 表的关系,一个角色可以含有多个用户,外键相关
Role.associate = () => {
app.model.Role.hasMany(app.model.User, { as: "users" });
};
return Role;
};
实现 Role 相关服务,创建 backend/app/service/role.js
文件如下:
const { Service } = require("egg");
class RoleService extends Service {
// 获取角色列表
async list(options) {
const {
ctx: { model }
} = this;
return model.Role.findAndCountAll({
...options,
order: [
["created_at", "desc"],
["id", "desc"]
]
});
}
// 通过 id 获取角色
async find(id) {
const {
ctx: { model }
} = this;
const role = await model.Role.findByPk(id);
if (!role) {
this.ctx.throw(404, "role not found");
}
return role;
}
// 创建角色
async create(role) {
const {
ctx: { model }
} = this;
return model.Role.create(role);
}
// 更新角色
async update({ id, updates }) {
const role = await this.ctx.model.Role.findByPk(id);
if (!role) {
this.ctx.throw(404, "role not found");
}
return role.update(updates);
}
// 删除角色
async destroy(id) {
const role = await this.ct