既然前端工程化是基于NodeJS，那么选择NodeJs做前后端分离部署也是理所应当的。其实只需要实现静态资源和代理的话，用nginx才是最好的选择，用NodeJS是为了日后能进一步在服务端上实现自动构建或服务端渲染。
同步到交流学习社区：https://www.mwcxs.top/page/438
一、目前只有前端的目录结构
小声说：小程序代码结构
二、创建一个简单后端服务器
在根目录下执行
npm init -y
npm init 用来初始化生成一个新的 package.json 文件。它会向用户提问一系列问题，如果你觉得不用修改默认配置，一路回车就可以了。
如果使用了 -f（代表force）、-y（代表yes），则跳过提问阶段，直接生成一个新的 package.json 文
接下来执行
npm i koa koa-static http-proxy-middleware async koa-router koa-bodyparser koa-json mysql -s第一个koa是基于NodeJS的服务器框架，
第二个koa-static是基于Koa的插件，我们需要用它建立静态资源服务器，
第三个http-proxy-middleware是用于做代理的插件。
有了这三个东西，我们就可以搭建出最简单的前端服务器了。
第四个async是用于异步操作
第五个koa-router是路由控制器，实现路由中间件
第六个koa-bodyparser是post提交数据中间件
第七个koa-json是get提交数据的中间件
第八个mysql是数据库中间件
-s 使用 --save 安装的插件，责被写入到 dependencies 对象里面去,dependencies 是需要发布到生产环境的
三、配置
项目根目录下会多出一个package.json，一个package-lock.json，一个node_modules，我们不用管这三个，而是在根目录下建立一个api文件夹，作为后端服务接口。
1、在api文件夹下新建一个app.js和mysql.js.
app.js内容如下
const Koa = require('koa');
const koaJson = require('koa-json');
const bodyParser = require('koa-bodyparser');
const path = require('path');
const http = require('http');
const fs = require('fs');
const async = require('async');
const query = require('./mysql.js');
const app = new Koa();
app.use(bodyParser());
app.use(koaJson());
app.use(async (ctx, next) => {
ctx.execSql = query;
await next();
});
// routes
fs.readdirSync(path.join(__dirname, 'routes')).forEach(function (file) {
if (~file.indexOf('.js')) app.use(require(path.join(__dirname, 'routes', file)).routes());
});
app.use(function (ctx, next) {
ctx.redirect('/404.html');
});
app.on('error', (error, ctx) => {
console.log('something error ' + JSON.stringify(ctx.onerror))
ctx.redirect('/500.html');
});
http.createServer(app.callback())
.listen(8090)
.on('listening', function () {
console.log('server listening on: ' + 8090)
});
mysql.js内容如下
const mysql = require('mysql');
const pool = mysql.createPool({
host: '127.0.0.1',
user: 'root',
password: '123456',
database: 'wx_contacts',
connectionLimit: 10
})
let query = function (sql, values) {
return new Promise((resolve, reject) => {
pool.getConnection(function (err, connection) {
if (err) {
return reject(err);
} else {
connection.query(sql, values, (err, rows) => {
connection.release();
if (err) {
return reject(err)
} else {
return resolve(rows);
}
})
}
})
})
}
module.exports = query;
2、在api文件夹下新建一个routes文件夹，文件夹下建立index.js
存放路由配置，index.js内容如下
const router = require('koa-router')();
const contact = require('../contact/index.js');
router.use('/contact', contact.routes(), contact.allowedMethods());
module.exports = router;
3、在api文件夹下新建一个contact文件夹，文件夹下建立index.js和contoller.js
index.js内容如下
const router = require('koa-router')();
const controller = require('./controller.js');
router.post('/login', controller.Login);
module.exports = router;
contoller.js内容如下
主要是接口调用的
/*
* 登录
*/
exports.Login = async(ctx) => {
let phone = ctx.request.body.phone || '';
let psd = ctx.request.body.password || '';
if (!phone || !psd) {
ctx.body = {
success: false,
message: '手机号码或密码不能为空'
};
return false;
}
try {
let result = await ctx.execSql(`select * from contact_user where phone = ? and password = ?`, [phone, psd]);
if (result.length > 0) {
ctx.body = {
success: true,
userID: result[0].id,
message: ''
};
} else {
ctx.body = {
success: false,
userID: 0,
message: '账号或密码错误'
};
}
} catch (err) {
ctx.body = {
success: false,
userID: 0,
message: err
};
}
}
四、运行
运行
node api/app.js
运行起来后，直接关掉终端即可，切不可Ctrl + C退出，否则服务又会停掉。
此时的项目结构