原生的http在某些方面表现不足以应对我们的开发需求,所以就需要使用框架来加快我们的开发效率,框架的目的就是提高效率,让我们的代码高度统一。
在node中有很多web开发框架。今天我们来学习express
学习Express
起步
安装:
npm install express
hello world
// 引入express var express = require('express'); // 1. 创建app var app = express(); // 2. app.get('/',function(req,res){ // 1 // res.write('Hello'); // res.write('World'); // res.end() // 2 // res.end('hello world'); // 3 res.send('hello world'); }) app.listen(3000,function(){ console.log('express app is runing...'); })
代码解释:
上面的代码是一个简单的使用 Express 框架创建服务器的例子。下面是每个部分的详细解释:
- 引入 Express 模块:
var express = require('express');
这一行代码是引入了 Express 模块,它提供了创建服务器和路由的工具。
- 创建应用程序实例:
var app = express();
这一行代码是创建了一个应用程序实例 app,它将用于创建路由和启动服务器。
- 创建路由:
app.get('/',function(req,res){ // ... })
这一段代码定义了一个路由,当用户通过 HTTP GET 请求访问网站根目录时,服务器将向用户返回 "hello world"。这里使用了 app.get()
函数,它接受两个参数:请求路径和一个回调函数。当用户访问指定的路径时,服务器将调用这个回调函数。
- 启动服务器:
app.listen(3000,function(){ console.log('express app is runing...'); })
这一行代码将服务器绑定到本地 3000 端口上,并在服务器启动时输出一条日志。
最后,这段代码中给出了三种不同的方式来向用户发送 "hello world" 响应:
基本路由
路由:
- 请求方法
- 请求路径
- 请求处理函数
get:
//当你以get方法请求/的时候,执行对应的处理函数 app.get('/',function(req,res){ res.send('hello world'); })
post:
//当你以post方法请求/的时候,执行对应的处理函数 app.post('/',function(req,res){ res.send('hello world'); })
Express静态服务API
// app.use不仅仅是用来处理静态资源的,还可以做很多工作(body-parser的配置) app.use(express.static('public')); app.use(express.static('files')); app.use('/stataic',express.static('public'));
上面这段代码使用了 express
框架中的 app.use
方法,用于处理静态资源文件。
express.static
方法是 express
框架中用于处理静态资源文件的中间件,它会根据传入的参数(即静态资源文件所在目录)生成一个可以直接访问静态资源文件的路径,供后续的请求使用。
例如:app.use(express.static('public'))
就是告诉 express
框架,当客户端请求静态资源文件时,从 public
目录中查找对应的文件,并返回给客户端。
这段代码中的三个 app.use
分别指定了不同的静态资源目录,例如:
- 第一个
app.use
中指定的是public
目录,这样就可以直接通过http://localhost:3000
访问到该目录下的文件。 - 第二个
app.use
中指定的是files
目录,这样就可以直接通过http://localhost:3000/files
访问到该目录下的文件。 - 第三个
app.use
中指定的是路由为/static
,这样就可以直接通过http://localhost:3000/static
访问到该目录下的文件。
需要注意的是,express.static
中间件的处理是有顺序的,如果多个中间件都能匹配到同一个静态资源文件,那么只有第一个能够匹配成功的中间件会被使用,后续的中间件会被忽略。
// 引入express var express = require('express'); // 创建app var app = express(); // 开放静态资源 // 1.当以/public/开头的时候,去./public/目录中找对应资源 // 访问:http://127.0.0.1:3000/public/login.html app.use('/public/',express.static('./public/')); // 2.当省略第一个参数的时候,可以通过省略/public的方式来访问 // 访问:http://127.0.0.1:3000/login.html // app.use(express.static('./public/')); // 3.访问:http://127.0.0.1:3000/a/login.html // a相当于public的别名 // app.use('/a/',express.static('./public/')); // app.get('/',function(req,res){ res.end('hello world'); }); app.listen(3000,function(){ console.log('express app is runing...'); });
上面这段代码这段代码使用了Express框架来创建了一个Node.js服务器,并且设置了一个静态资源目录。具体解释如下:
- 引入Express框架:
var express = require('express');
- 创建一个Express应用程序:
var app = express();
- 设置静态资源目录:
// 1.当以/public/开头的时候,去./public/目录中找对应资源 app.use('/public/',express.static('./public/'));
这段代码表示当访问以/public/
开头的资源时,Express会去./public/
目录中寻找相应的资源文件并返回给客户端。例如,当访问http://127.0.0.1:3000/public/login.html
时,会返回./public/login.html
文件内容。
- 设置路由:
app.get('/',function(req,res){ res.end('hello world'); });
这段代码表示当访问根目录/
时,服务器会返回hello world
字符串。
- 启动服务器:
app.listen(3000,function(){ console.log('express app is runing...'); });
这段代码表示将服务器监听在3000端口,当有客户端请求到达时,服务器会启动回调函数,并在控制台输出express app is runing...
。
在Express中配置使用art-templete
模板引擎
- art-template官方文档
- 在node中,有很多第三方模板引擎都可以使用,不是只有
art-template
- 还有ejs,jade(pug),handlebars,nunjucks
安装:
npm install --save art-template npm install --save express-art-template //两个一起安装 npm i --save art-template express-art-template
配置:
app.engine('html', require('express-art-template'));
使用:
app.get('/',function(req,res){ // express默认会去views目录找index.html res.render('index.html',{ title:'hello world' }); })
如果希望修改默认的views
视图渲染存储目录,可以:
// 第一个参数views千万不要写错 app.set('views',目录路径);
在Express中获取表单请求数据
获取get请求数据:
Express内置了一个api,可以直接通过req.query
来获取数据
// 通过requery方法获取用户输入的数据 // req.query只能拿到get请求的数据 var comment = req.query;
获取post请求数据:
在Express中没有内置获取表单post请求体的api,这里我们需要使用一个第三方包body-parser
来获取数据。
安装:
npm install --save body-parser;
配置:
// 配置解析表单 POST 请求体插件(注意:一定要在 app.use(router) 之前 )
var express = require('express') // 引包 var bodyParser = require('body-parser') var app = express() // 配置body-parser // 只要加入这个配置,则在req请求对象上会多出来一个属性:body // 也就是说可以直接通过req.body来获取表单post请求数据 // parse application/x-www-form-urlencoded app.use(bodyParser.urlencoded({ extended: false })) // parse application/json app.use(bodyParser.json())
使用:
app.use(function (req, res) { res.setHeader('Content-Type', 'text/plain') res.write('you posted:\n') // 可以通过req.body来获取表单请求数据 res.end(JSON.stringify(req.body, null, 2)) })
在Express中配置使用express-session
插件操作
安装:
npm install express-session
配置:
//该插件会为req请求对象添加一个成员:req.session默认是一个对象 //这是最简单的配置方式 //Session是基于Cookie实现的 app.use(session({ //配置加密字符串,他会在原有的基础上和字符串拼接起来去加密 //目的是为了增加安全性,防止客户端恶意伪造 secret: 'keyboard cat', resave: false, saveUninitialized: true,//无论是否适用Session,都默认直接分配一把钥匙 cookie: { secure: true } }))
使用:
// 读 //添加Session数据 //session就是一个对象 req.session.foo = 'bar'; //写 //获取session数据 req.session.foo //删 req.session.foo = null; delete req.session.foo
提示:
默认Session数据时内存储数据,服务器一旦重启,真正的生产环境会把Session进行持久化存储。