紧接上一节,这一篇我们主要讲Express搭建,这篇内容会比较多,大家需要细心一点
全栈宝宝级教学—小程序前端+Express后端+MySQL数据库(上)
全栈宝宝级教学—小程序前端+Express后端+MySQL数据库(下)
四、Express搭建
现在我们开始Express的安装
输入以下命令(后面带个-g 指全局安装):
sudo npm install express -g
sudo npm install express-generator -g
#查看express版本
express --version
#4.16.1
然后进入当前用户文件夹下,并创建我们的项目“myProject”,命令如下
#进入到当前用户目录下
cd ~
#创建我们的express项目
express myProject
#查看当前目录下的所有文件
ls
已经安装好了,但是还需要安装一些依赖,然后测试一下
#打开我们的项目文件夹,cd 然后打个m,按Tab键会自动补全
cd myProject/
#安装依赖
npm install
#启动服务
npm start
然后我们在浏览器中,输入你服务器的IP:3000(如127.0.0.1:3000),就可以看到如下画面啦
接下来就要写Model层啦,当然写法也有很多种,简单的写法是不封装直接在函数里面写SQL语句,但是这样后期维护非常麻烦,所以为了我们的代码整洁,且逻辑清晰,这里都对各个部分进行了简单封装。
先放一个最后的目录结构图,其中表示我们需要手动创建的文件,表示框架生成但是我们需要进行修改的文件。
首先创建一个conf文件夹用来放一些配置信息
mkdir conf
之后创建一个dao文件夹(Data Access Object)用来放跟数据库操作相关文件
mkdir dao
在myProject目录下进入conf文件夹
cd conf
然后创建一个database.js文件用来配置我们的数据库信息,创建新文件可以直接用vim/nano 文件名.文件类型
关于这两个编辑器你喜欢哪个,个人建议初学者可以先使用nano,因为有提示,等你写的多了就自然会用vim了
vim database.js
然后你将看到如下界面:
考虑到该篇为宝宝级教学,在这里就讲几个最最基础的操作(了解更多请点这里),为了用最简单的方式完成任务,你只需要知道以下4个按键/命令
用途 | 按键/命令 |
---|---|
进入命令模式 | 按 esc |
进入编辑模式 | 按 i |
保存退出 | :wq |
强制退出 | :q! |
我们一用vim打开某个文件时,就进入的是命令模式,这时候按 i 键就进入了编辑模式,然后就可以愉快的写代码啦,当你敲完以下代码后(其中的password替换成你自己的数据库密码):
当你写完后请按 Esc 键,这样我们又进入了命令模式,然后请输入
:wq
,我们就保存文件并退出了,因为我们用的MySQL所以还需要在package.json文件里面配置一下
返回上一级目录
cd ..
编辑package.json文件
vim package.json
在"dependencies"里面加入下面这行代码,如果报错,看看是不是少逗号
"mysql": "latest"
最后文件内容大概如下:
{
"name": "myproject",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "node ./bin/www"
},
"dependencies": {
"cookie-parser": "~1.4.4",
"debug": "~2.6.9",
"express": "~4.16.1",
"http-errors": "~1.6.3",
"jade": "~1.11.0",
"morgan": "~1.9.1",
"mysql": "latest"
},
"devDependencies": {
"body-parser": "^1.19.0"
}
}
按Esc,保存退出
:wq
好了现在我们进入dao文件夹,先创建一个basicConnection.js用来连接数据库
cd dao
创建一个basicConnection.js文件
vim basicConnection.js
将以下代码输入进去,第一个function是做返回响应的,第二个function是与数据库建立链接并执行操作
var mysql = require('mysql');
var dbConfig = require('../conf/database');
var pool = mysql.createPool(dbConfig.mysql);
function responseDoReturn(res, result,resultJSON) {
if(typeof result === 'undefined') {
res.json({
code:'201',
msg: 'failed to do'
});
} else {
res.json(result);
}
};
function queryArgs(sql,args, callback) {
console.log('Doing basicConnect.queryArgs');
pool.getConnection(function (err, connection) {
connection.query(sql, args,function (err, rows) {
callback(err, rows);
connection.release();
});
});
}
module.exports = {
queryArgs: queryArgs,
doReturn: responseDoReturn
}
最后同样按Esc,保存退出
:wq
然后我们要在dao文件夹里再创建一个products文件夹,这个文件夹中的products_sql.js用来向外部提供所用到的SQL语句,而products_dao.js用来向外部提供对该表操作的接口(比如增删改查,这里为了测试就只写了增,剩下的大家改写一下就ok)记得每个文件写完后保存退出
mkdir products
进入products文件夹里
cd products
创建products_sql.js
vim products_sql.js
输入以下代码,这个里面就是SQL语句了,包含了增删改查基本操作
var product_sql = {
addProduct: "INSERT INTO products(name,price) VALUES(?,?);",
deleteProduct: "DELETE FROM products WHERE id = ?;",
updateProduct: "UPDATE products SET name = ?, price = ? WHERE id = ?;",
queryProduct: "SELECT * FROM product WHERE id = ?;",
}
module.exports = {
product_sql: product_sql
}
然后现在创建products_dao.js文件
vim products_dao.js
输入以下代码
var db = require('../basicConnection');
var sqlCommands = require('./products_sql');
function addProduct(req, res, next){
console.log("Doing addProduct, req = " + JSON.stringify(req));
var param = req;
console.log('sqlCommands = ' + sqlCommands.product_sql.addProduct);
db.queryArgs(sqlCommands.product_sql.addProduct,
[param.name, param.price],
function(err, result){
if(!err){
result = {
code: 200,
msg: 'successful'
}
}
db.doReturn(res, result);
}
)
}
module.exports = {
addProduct: addProduct
}
现在我们需要返回到myProject目录下(cd ../../
),再安装一个body-parser,这是一个HTTP请求体解析的中间件,使用这个模块可以解析各种格式的请求体(我们等会前端用POST请求时要用到)
返回到myProject目录下后请输入以下指令
npm install body-parser
安装完成后,我们需要在app.js文件里面加几行代码,已经用标示出来,大家照着打就行,不想打就分别复制下面的代码,最后保存退出:
#编辑app.js文件
vim app.js
#所添代码
var productsRouter = require('./routes/products');
var bodyParser = require('body-parser');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: true}));
app.use('/products', productsRouter);
然后我们再重新输入以下代码,重新安装一下依赖
npm install
现在我们可以进入routes文件夹了,准备新建一个products.js路由文件,基本就快接近胜利了
进入routes文件夹
cd routes
创建一个products.js文件
vim products.js
输入以下代码
var express = require('express');
var router = express.Router();
var productDAO = require('../dao/products/products_dao')
router.post('/addProducts', function(req, res, next){
console.log('Router start ')
console.log('Red.body = ' + JSON.stringify(req.body));
productDAO.addProduct(req.body, res, next)
});
module.exports = router;
至此我们的Express搭建可以告一段落,下一篇我们将结合前端进行测试