写了很久的前端,像JQuery,ext.js,React Native,小程序都摸了一个遍。早就听说了node.js,最近难得闲下心来,简单的摸索一下,后面有时间,一定要做一个实实在在的项目出来。下面是摸索过程。
首先是在电脑上安装node和npm了,这些就不说了,相信做前端的朋友们,电脑上早就有了这些开发环境。如果有不知道的,自行百度解决,因为这是入门必备环境,这里就不在赘述。
车速很快,大家跟上,开始了。
第一步:首先是安装webstorm,为什么强烈推荐这个呢,别的不说,省事。webstorm怎么安装,下载什么版本,大家依据自己电脑来定。安装好以后,新建node.js项目啦。如下图
新建node.js项目.jpeg
稍等一会,项目好了。如下图所示
新建的项目.jpeg
至于每一个文件夹是干嘛的,我建议大家都一一点开看看,就明白了。这里简单介绍一下
bin-》www:server的创建,名字,监听端口号,错误处理
node_modules:存放各种基础模块文件,比如我们的express,类似与iOS中的各种库。
public:静态文件目录。放置托管的静态文件,例如图片、CSS、JavaScript 文件等,通过http://localhost:3000/images/kitten.jpg 方式就可以直接访问。
routes:MVC中的Controller目录
index.js-》exports方法:可以将接口暴露给外部调用
index.js-》res.render方法:将数据通过引擎模版(这里是jade)做展示,用不到
users.js-》res.send方法:将数据直接返回给请求方。由于我们是要做app的服务器,只要返回json就可以了,所以选择此方法。
views:MVC中的View目录,存放视图模版(这里是jade),整个用不到。
app.js:工程主进程文件。
package.json:显示一些配置
当然,想开发自己的项目,得对目录进行一些改造,下面是我自己测试的项目。
我自己的项目.jpeg
下面对自己增加的几个目录做一些说明
controller:控制器,这里进行一些逻辑处理,主要是写接口时,接口的参数拿到,进行一些处理然后在返回相应的结果。
models:就叫他模型层吧,主要定义一个模型的相应字段和对应数据库。
mongodb:链接mongodb数据库,进行一些处理。
好了,下面主要对增删改查的几个文件做重要说明。
首先是app.js文件
var createError = require('http-errors');
var express = require('express');
var db =require('./mongodb/db.js');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
// 引入json解析中间件
var bodyParser = require('body-parser');
var multer = require('multer');
// var indexRouter = require('./routes/index');
// var usersRouter = require('./routes/users');
var router = require('./routes/index.js');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.use(multer());
// app.use('/', indexRouter);
// app.use('/users', usersRouter);
router(app);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
next(createError(404));
});
// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
// render the error page
res.status(err.status || 500);
res.render('error');
});
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin,X-Requested-With,Content-Type,Accept,params");
res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
res.header("X-Powered-By",' 3.2.1')
res.header("Content-Type", "application/json;charset=utf-8");
next();
});
module.exports = app;
直接看var router = require('./routes/index.js');这里是把我们写的路由引过来,记得下面要使用router(app)方法进行调用;
下面是./routes/index.js文件
'use strict';
var shop = require('./shop');
var users = require('./users');
const router = app =>{
app.use('/shop',shop);
app.use('/users',users);
};
module.exports = router;
这里是对路由进行一些整理,所有的都放一起,然后在每一个路由下面进行增删改查操作。
继续往下,查看./users.js文件
'use strict'
var express = require('express');
var router = express.Router();
var User = require('../controller/users/index');
/* GET users listing. */
router.get('/', function(req, res, next) {
res.send('respond with a resourcewww');
});
router.get('/list', function(req, res, next) {
console.log("req",req);
console.log("res",res);
res.send({name:req.query.name,age:req.query.age});
});
router.post('/add',User.add);// 增加
router.post('/remove',User.remove); //删除
router.post('/edit',User.edit);// 修改
router.get('/getOne',User.getOne);// 根据id查找
router.get('/getAllUsers',User.getAllUsers);// 获的所有数据
module.exports = router;
这里就可以看到一些增删改查路由啦。
我们直接可以到postman里面进行调用。如获取所有的数据,直接在postman里面输入。就可以查看到效果
http://localhost:3000/users/getAllUsers
继续探索,User.getAllUsers方法,打开../controller/users/index文件,
/**
* Created by wind on 2018/9/29
*
* Description:
*/
'use strict'
var UserAdmin = require('../../models/user/index');
var formidable = require('formidable');
var dtime = require('time-formater');
var BaseController = require('../BaseController');
class User extends BaseController{
constructor(){
super();
this.add = this.add.bind(this);
this.remove = this.remove.bind(this);
this.edit = this.edit.bind(this);
this.getOne = this.getOne.bind(this);
this.getAllUsers = this.getAllUsers.bind(this);
}
// 增加数据
async add(req,res,next){
if(!req.body.name||!req.body.age){
res.send({
status: 0,
message: '数据填写不完整',
});
return;
}
try{
const userId = await this.getId('user_id');//自增id
const newUser = {
id:userId,
name:req.body.name,
age:req.body.age,
password:req.body.password,
create_time:dtime(new Date()).format('YYYY-MM-DD HH:mm')
};
// 添加到数据库
await UserAdmin.create(newUser);
res.send({
status: 1,
message: '添加成功',
})
}catch (err){
res.send({
status: 0,
message: '添加失败',
err:err
})
}
};
// 编辑数据
async edit(req,res,next){
const userId = req.body.userId;
if(!userId){
res.send({
status:0,
message:'没有要编辑的信息'
});
return;
}
try{
// 查找老数据
const userinfo = await UserAdmin.findOne({id:userId});
// 合并老数据与新数据得到新对象
const newObj = Object.assign(userinfo,req.body);
// 更新数据库
await UserAdmin.findOneAndUpdate(newObj);
// 把更新后的数据传给前台
const newUserInfo = await UserAdmin.findOne({id:userId});
res.send({
status:1,
message:'修改成功',
result:newUserInfo
});
}catch (err){
res.send({
status: 0,
message: '编辑失败',
err:err
})
}
};
// 删除数据
async remove(req,res,next){
const userId = req.body.userId;
if(!userId){
res.send({
status: 0,
message: '没有要删除的信息',
});
return;
}
try{
// 找到数据并删除
await UserAdmin.findOneAndRemove({id:userId});
res.send({
status: 1,
message: '删除成功',
})
}catch (err){
res.send({
status: 0,
message: '删除失败',
err:err
})
}
};
// 查询单条数据
async getOne(req,res,next){
const userId = req.query.userId;
if(!userId){
res.send({
status: 0,
message: '没有要查询的信息',
});
return;
}
try{
// 根据id从数据库查找
const userinfo = await UserAdmin.findOne({id:userId});
res.send({
status:1,
result:userinfo
});
}catch (err){
res.send({
status: 0,
message: '查询失败',
err:err
});
}
};
// 获取所有数据
async getAllUsers(req,res,next){
try{
const userList = await UserAdmin.find();
res.send({
status:1,
result:userList
});
}catch (err){
res.send({
status: 0,
message: '查询失败',
err:err
});
}
};
}
module.exports = new User();
可以看到逻辑并不复杂,就是进行一些数据处理。一些常用方法可能看着陌生,多用几遍就熟悉了。可以通过这个文件看到,最终都是通过const userList = await UserAdmin.find();这种类似的语句来进行数据库的操作,大家想进行什么操作,可以细细研究下这种类似的方法,对于初学者,增删改查四个就足够啦。下面贴一下model的代码
/**
* Created by wind on 2018/9/29
*
* Description:
*/
'use strict';
var mongoose =require('mongoose');
const Schema = mongoose.Schema;
const userSchema = new Schema({
id:Number,
name:String,
age:Number,
password:{type:String,default:"888999"},
create_time:String
});
userSchema.index({id:1});
const User = mongoose.model('User',userSchema);
module.exports = User;
至于controller里面const userId = await this.getId('user_id');//自增id,这句其实就是自增id操作啦。好了就写这么多了,有疑问的同学可以在评论区说明,我看到了会即使回复,下面附上源代码地址:https://github.com/fangcaiwen/node.js-/tree/master
网友评论