一、安装
1、安装nodejs
2、全局安装express
和express-generator
npm install -g express
npm install -g express-generator//最新express4.0版本中将命令工具分家出来了,所以我们还需要安装一个命令工具
3、创建项目
express -e blog//-e:添加ejs模板引擎,其他功能可以express -h查看
4、安装依赖
npm i
5、运行
npm start
打开localhost:3000
,页面显示如下:
![](https://i-blog.csdnimg.cn/blog_migrate/a416aa1d3adb97b6c8f32da156f89202.png)
![](https://i-blog.csdnimg.cn/blog_migrate/7ecfb3ecf171084418d79f71f8a379b4.png)
app.js主要用于各项基础配置
var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
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('/', indexRouter);
app.use('/users', usersRouter);
// 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');
});
module.exports = app;
二、目录结构
bin:
存放启动项目的脚本文件node_modules:
存放所有的项目依赖库。public:
静态文件(css,js,img)routes:
路由文件(MVC中的C,controller)views:
页面文件(Ejs模板)package.json:
项目依赖配置及开发者信息app.js:
应用核心配置文件
三、路由控制
app.js中下面两行代码指定路由文件;
user中第一个参数指定根目录,usersRouter文件中的路由配置都是其子路径,例如:/users/route1、/users/route2
app.use('/', indexRouter);
app.use('/users', usersRouter);
\routes\index.js代码
var express = require('express');
var router = express.Router();
//对应前台路径:http://localhost:3000/
router.get('/', function(req, res, next) {
res.render('index', { title: 'Express' });
});
module.exports = router;
\models\users.js代码
var mongoose = require('../db/mongooseDb.js'),
Schema = mongoose.Schema;
var UserSchema = new Schema({
username : { type: String }, //用户账号
userpwd: {type: String}, //密码
userage: {type: Number}, //年龄
logindate : { type: Date} //最近登录时间
});
module.exports = mongoose.model('User',UserSchema);
\routes\users.js代码
var express = require('express');
var router = express.Router();
//对应前台路径:http://localhost:3000/users
router.get('/', function(req, res, next) {
res.send('respond with a resource');
});
module.exports = router;
更多express路由配置请看:https://www.expressjs.com.cn/4x/api.html#router
四、模板引擎
app.js
中一下两行代码制定了模板文件夹和使用的模板引擎。
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
常用标签
a、<%%>
标签里可以写js代码-定义变量
<% var data = 50;var hello = '<h3>hello world</h3>' %>
b、<%=%>和<%-%> 区别 前者不会编译,后者会编译
<h2>data的值为 : <%=data%></h2>
<%=hello%><br>
<%-hello%>
运行结果:
![](https://i-blog.csdnimg.cn/blog_migrate/fa71069178656a374b22a875b160903b.png)
<%include a%>//a是同目录下的a.ejs
d、<%for%>一般用于后端查询出一段数组数据,前端展示
后端虚拟数据:
req.titles = [
{name:'nodejs官网',url:'http://nodejs.org/'},
{name:'express官网',url:'http://www.expressjs.com.cn/'},
{name:'ejs官网',url:'http://www.embeddedjs.com/'},
{name:'javascript官网',url:'http://www.w3school.com.cn/js/'}
];
res.render('ejs',req);
前端代码:
<%for(var i=0; i < titles.length; i++){ var title = titles[i]; %>
<h3>标题 : <%=title.name%> ,地址 : <%=title.url%> </h3>
<%}%>
运行效果:
![](https://i-blog.csdnimg.cn/blog_migrate/ffc1e2aba173f77f2cd8b525bef25273.png)
后端虚拟数据
req.numbers = [
parseInt(10*Math.random()),
parseInt(10*Math.random()),
parseInt(10*Math.random()),
parseInt(10*Math.random()),
parseInt(10*Math.random()),
parseInt(10*Math.random()),
parseInt(10*Math.random()),
parseInt(10*Math.random()),
parseInt(10*Math.random()),
parseInt(10*Math.random())
];
res.render('ejs',req);
前端代码:
<%for(var i=0; i < numbers.length; i++){ var number = numbers[i]; %>
<%if(number < 5){%>
<h3>获取后端值小于5,值为 : <%=number%></h3>
<%}else{%>
<h3>获取后端值大于4,值为 : <%=number%></h3>
<%}%>
<%}%>
运行结果:
![](https://i-blog.csdnimg.cn/blog_migrate/52df8510e64cc0a02ca43f58ca3f1b66.png)
五、MongoDB数据库
1、下载
地址1:Download Center: Community Server | MongoDB
地址2:http://dl.mongodb.org/dl/win32/x86_64
下载后运行安装时注意,
![](https://i-blog.csdnimg.cn/blog_migrate/19c53f5555d40e6c056528c0daefbf36.png)
打开mongodb安装目录下bin目录,例如:C:\Program Files\MongoDB\Server\4.2\bin>,执行下面代码
./mongod --dbpath D:\MongoDB\data
//这个路径是mongodb数据库文件存放地点,可自定义;
//"./"必须加,win10中powershell不支持执行mongod --dbpath D:\MongoDB\data
//D:\MongoDB\data目录要提前创建好
3、访问
进入mongodb安装目录bin中,命令行执行:./mongo
。一些常用的命令:
数据库:show dbs ;use mytest ; db.dropDatabase()
集合:show collections ; db.createCollection("mycollection") ; db.mycollection.drop()
文档:db.mycollection.find() ; db.mycollection.insert({name:"xxx"}) ; db.mycollection.remove({'name':'xxx'})
更多:https://www.runoob.com/mongodb/mongodb-query.html
推荐MongoDB的可视化工具
studio-3t
、robo-3t
,版本:robo3t-1.3.1-windows-x86_64-7419c406.exe
链接:https://pan.baidu.com/s/1HqyABG8gD2o_cuzXMQ44Bw
提取码:le9q在express中,都是基于数据模型对mongodb进行增删改查,所以可视化工具更多是用来查看数据
六、mongoose 数据模型
直接用 node.js 也可以连接数据库进行读写,但很多插件除了封装这个基本功能之外,还提供了很多其他的服务。对于 MongoDB,我不会使用原生 node 去操作,而是选了 mongoose 这个插件。mongoose 官网: https://mongoosedoc.top/
1、安装 mongoose
npm install mongoose --save-dev
2、根目录创建数据库配置文件db\config.js
module.exports = {
mongodb_url: "mongodb://localhost:27017/blog"
}
3、根目录创建数据库连接文件db\mongooseDb.js
let mongoose = require("mongoose");
let config = require("./config");
var DB_URL = config.mongodb_url;
mongoose.Promise = global.Promise;
/**
* 连接
*/
mongoose.connect(DB_URL);
/**
* 连接成功
*/
mongoose.connection.on('connected', function () {
console.log('Mongoose connection success to ' + DB_URL);
});
/**
* 连接异常
*/
mongoose.connection.on('error', function (err) {
console.log('Mongoose connection error: ' + err);
});
/**
* 连接断开
*/
mongoose.connection.on('disconnected', function () {
console.log('Mongoose connection disconnected');
});
module.exports = mongoose
4、使用
let User = require("../models/user");
var express = require('express');
var router = express.Router();
router.get('/add', async function (req, res, next) {
var m = new User({
uid: 'kkk',
type: 2,
uname: "飞牛",
logintime: new Date
});
await m.save();
res.send('add1');
})
module.exports = router;
在打开http://localhost:3000/users/add
后,进入studio 3T就看到添加了一条数据
![](https://i-blog.csdnimg.cn/blog_migrate/b112b58f01589a0cf6d29d407700cea0.png)
七、自动重启工具nodemon
node程序在修改后,都需要npm start
重启后才能生效,很麻烦。这里使用nodemon来实现自动重启。1、全局安装
npm i -g nodemon
2、在项目根目录新建nodemon.json
{
"restartable": "rs",
"ignore": [
".git",
".svn",
"node_modules/**/node_modules"
],
"verbose": true,
"execMap": {
"js": "node --harmony"
},
"watch": [
],
"env": {
"NODE_ENV": "development"
},
"ext": "js json"
}
restartable:
设置重启模式ignore:
设置忽略文件verbose:
设置日志输出模式,true 详细模式execMap:
设置运行服务的后缀名与对应的命令
{ “js”: “node –harmony” }
表示使用 nodemon 代替 nodewatch:
监听哪些文件的变化,当变化的时候自动重启ext:
监控指定的后缀文件名3、启动
a、不使用express generator的项目,直接运行nodemon app.js
;
b、使用express generater的项目,在package.json
的scripts
中添加"auto": "nodemon ./bin/www"
, 用npm run auto
启动项目,源码修改并保存之后,服务器就可以自动启动了。
八、设置session
1、安装
npm install express-session --save
2、app.js配置引入(务必放在路由配置前面)
var session = require('express-session');
//配置中间件
app.use(session({
secret: "keyboard cat",
resave: false,
saveUninitialized: true,
cookie: ('name', 'value', { maxAge: 5 * 60 * 1000, secure: false })
}));
3、routes/users.js中使用
router.get('/login', async function (req, res, next) {
req.session.username = "wjb";
res.send('登录成功!' + req.session.username);
})
router.get('/info', async function (req, res, next) {
res.send('用户信息:' + req.session.username);
})
router.get('/loginout', async function (req, res, next) {
req.session.destroy(function (err) {
res.send("退出登录!" + err);
});
})
页面效果:
![](https://i-blog.csdnimg.cn/blog_migrate/8b4ab07c7b699978b09fb0598d1fc06a.png)
![](https://i-blog.csdnimg.cn/blog_migrate/9e8942881f967a63d87480945d56ea74.png)
![](https://i-blog.csdnimg.cn/blog_migrate/7d4f83c249357a2edc834e9775da027d.png)
![](https://i-blog.csdnimg.cn/blog_migrate/7d61cd04411da361855d7cadaee64f7b.png)
八、设置session(使用redis作为会话存储实例)
1、安装
npm install redis connect-redis express-session
2、app.js配置引入
const redis = require('redis')
const session = require('express-session')
let RedisStore = require('connect-redis')(session)
let redisClient = redis.createClient()
//配置中间件
app.use(session({
secret: "keyboard cat",
resave: false,
saveUninitialized: true,
store: new RedisStore({ client: redisClient }),
cookie: {
secure: false,
maxAge: 1000 * 60 * 60 * 24 * 30
}
}));
3、routes/users.js中使用
使用方式同上没有区别。
执行上面操作后,可以使用react redis查看redis数据,如下图:
![](https://i-blog.csdnimg.cn/blog_migrate/2d9a9e6448cc70b30cf1cd68972a9d38.png)