一、express简介
Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具。
Web 应用:Express 是一个基于 Node.js 平台的极简、灵活的 web 应用开发框架,它提供一系列强大的特性,帮助创建各种 Web 和移动设备应用。
API:丰富的 HTTP 快捷方法和任意排列组合的 Connect 中间件,让你创建健壮、友好的 API 变得既快速又简单。
性能:Express 不对 Node.js 已有的特性进行二次抽象,只是在它之上扩展了 Web 应用所需的基本功能。
Express 框架核心特性:
- 可以设置中间件来响应 HTTP 请求。
- 定义了路由表用于执行不同的 HTTP 请求动作。
- 可以通过向模板传递参数来动态渲染 HTML 页面。
二、安装 Express
Step1:为你的应用创建一个目录,然后进入此目录并将其作为当前工作目录,如在D盘创建node-test文件夹。
image.png
Step2:通过 npm init 命令为你的应用创建一个 package.json 文件,此命令将要求你输入几个参数,例如此应用的名称和版本。 你可以直接按“回车”键接受默认设置即可。
image.png
Step3:接下来安装 Express 并将其保存到依赖列表中:
image.png
以上命令会将 Express 框架安装在当前目录的 node_modules 目录中, node_modules 目录下会自动创建 express 目录。
注释:安装 Node 模块时,如果指定了 --save 参数,那么此模块将被添加到 package.json 文件中 dependencies 依赖列表中。 然后通过 npm install 命令即可自动安装依赖列表中所列出的所有模块。
创建完成后的工作目录:
image.png
同时你也会发现,多了一个目录,叫 node_modules,这就是存放刚才安装的 express 库所有要用到的源码文件。
如果你使用的是 npm 5,可能还会在目录中看到一个 package-lock.json 文件。
以下几个重要的模块需要与 express 框架一起安装:
- body-parser 用于处理 JSON, Raw, Text 和 URL 编码的数据。
- cookie-parser 解析Cookie的工具。通过req.cookies可以取到传过来的cookie,并把它们转成对象。
- multer 用于处理 enctype="multipart/form-data"(设置表单的MIME编码)的表单数据。
安装方法:
cnpm install body-parser --save
cnpm install cookie-parser --save
cnpm install multer --save
安装后的配置文件:
image.png
三、简单实例
1、hello world例子
在项目根目录下创建express.js文件,并输入如下代码:
//express.js
var express=require('express');
var app=express();
//主页输出 "Hello World"
app.get('/',function (req,res) {
res.send('Hello World');
})
//创建服务并监听8081端口
var server=app.listen(8081,function () {
var host=server.address().address;
var port=server.address().port;
console.log("应用实例,访问地址为 http://%s:%s", host, port)
})
启动服务,打开命令行,输入node express.js
执行命令:
在浏览器中访问 http://127.0.0.1:8081
,结果如图:
2、路由和静态文件
在项目根目录下创建express2.js文件,并输入如下代码:
//express2.js
var express =require('express');
var app=express();
//访问静态文件
app.use(express.static('public'));
//主页输出hello world
app.get('/',function (req,res) {
console.log('主页get请求');
res.send('hello get');
})
//post请求
app.post('/',function (req,res) {
console.log('主页post请求');
res.send('hello post');
})
//del_user页面相应
app.get('/del_user',function (req,res) {
console.log('/del_user响应delete请求');
res.send('删除页面');
})
//list_user页面
app.get('/list_user',function (req,res) {
console.log('/list_user响应');
res.send('用户列表页面');
})
//对页面abcd,abxcd,ab123cd等响应get请求
app.get('/ab*cd',function (req,res) {
console.log('/ab*cd请求页面');
res.send('正则匹配页面');
})
//创建服务并监听8081端口
var server=app.listen(8081,function () {
var host=server.address().address;
var port=server.address().port;
console.log('应用实例,访问地址为http://%s:%s',host,port);
})
打开命令行,输入node express2.js执行命令:
image.png在浏览器中访问 http://127.0.0.1:8081
,结果如下图所示:
在浏览器中访问 http://127.0.0.1:8081/list_user
,结果如下图所示:
在浏览器中访问 http://127.0.0.1:8081/abcd
,结果如下图所示:
Express 提供了内置的中间件 express.static 来设置静态文件如:图片, CSS, JavaScript 等。可以使用 express.static 中间件来设置静态文件路径。例如,如果将图片, CSS, JavaScript 文件放在 public 目录下,可以这么写:
app.use(express.static('public'));
在浏览器中访问 http://127.0.0.1:8081/111.png
,结果如下图所示:
网友评论