由于毕业项目需要前后端都有,前端做了个大概,思路设计的基本清晰,所以后台开始准备着手做了~
前期工作
刚开始自己打算把后台文件直接放到前端项目文件中,考虑到后台配置问题、前后端分离,所以把后台放到一个独立的项目文件中,这样方便管理和修改~
步骤:
提前安装好nodejs
- 首先选择创建项目的地址,如果在某个文件夹中创建,则在其文件夹中cmd,然后输入express -t ejs 项目名称 。创建好项目后,结构就会是这样
然后再npm install - routes文件夹中文件中就是咱们要写的接口,这两个文件用来写接口远远不够的,所以以users.js中的内容来新建js文件(每个js文件负责不同模块的接口,这样便于区分修改)
users.js文件内容如下:
var express = require('express');
var router = express.Router();
/* GET users listing. */
router.get('/', function(req, res, next) {
res.send('respond with a resource');
});
module.exports = router;
router的get/post方法就是咱们写的一个个接口,测试过程直接省略…
我直接拿node.js连接mysql数据库举例
- 数据库已经建好,我用SQLyog应用来给大家展示新建的数据库,如图
users.js文件修改后的代码
var express = require('express');
var router = express.Router();
var mysql = require('mysql');
var connection = mysql.createConnection({
host : 'localhost',
user : 'root',
password : '19980605',
port: '3306',
database: 'campus-social'
});
connection.connect();
var param="bbbbbbb";
/* GET users listing. */
router.get('/', function(req, res, next) {
res.json({
status:"0",
msg:param
});
res.send('respond with a resource');
});
//查询学校列表
router.get('/school', function(req, res, next) {
connection.query("select * from school",function (err, result) {
if(err){
// res.send(err.message);
res.json({
status:"1",
msg:err.message
});
return;
}else{
// res.send(result);
res.json({
status:"0",
msg:result
});
}
});
// connection.end();
// res.send('respond with a resource');
});
module.exports = router;
输入node ./www/bin
咱们去http://localhost:3000测试一下,这是主页面
那如何去想要测试的接口测试呢?
正常情况下地址是这样的:http://localhost:3000/js文件名/接口名,
要想修改或新建js接口文件,请去app.js文件中修改或新增,修改位置如下:
我要测试users.js中的school接口(查询学校列表接口),结果显示为
测试成功!
- 接下来我们就要与前端联调,打开我们的前端项目,目录大致为这样,
根目录下有一个config文件夹,文件夹中有一个index.js,代码proxyTable中添加后台中上方所提到的app.use中起的名字,例:
- 在vue文件中用axios来调用接口
注意,前后端联调时,运行前端项目时,别忘了运行后台,node ./www/bin,才能访问到接口;还有正常后台向前端传报文时,报文一般格式是:{status:状态码,msg:内容},这样方便快速定位错误。
在公司实习期间,遇到状态码为500时,好像是服务器后台的问题,但是前端出现问题也可能造成500报错,所以,在和其他人配合时,先确定是否自己前端这边的问题。
看一下前端接口数据显示,如图
界面上用到该接口的地方,如图
写接口时,有可能会遇到问题,请见上一篇