Node.js之express框架

一、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执行命令:

image.png

在浏览器中访问 http://127.0.0.1:8081,结果如图:

image.png

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,结果如下图所示:

image.png

在浏览器中访问 http://127.0.0.1:8081/list_user,结果如下图所示:

image.png

在浏览器中访问 http://127.0.0.1:8081/abcd,结果如下图所示:

image.png

Express 提供了内置的中间件 express.static 来设置静态文件如:图片, CSS, JavaScript 等。可以使用 express.static 中间件来设置静态文件路径。例如,如果将图片, CSS, JavaScript 文件放在 public 目录下,可以这么写:

app.use(express.static('public'));

在浏览器中访问 http://127.0.0.1:8081/111.png,结果如下图所示:

image.png

参考:express中文网
nodejs教程

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Express 简介 Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮...
    保川阅读 2,044评论 0 24
  • 先介绍下express: Express 是一个基于 Node.js 平台的极简、灵活的 web 应用开发框架,它...
    HelloKang阅读 4,276评论 0 8
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,268评论 19 139
  • Express 简介Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助...
    夜幕小草阅读 2,448评论 0 9
  • 忽略对楼下的具体缘起。遗忘是给自己最好的礼物。 备注:本简书名词只针对简书内容,与现实无关。所谓春秋笔法实在学不来。
    炼心清秋阅读 118评论 0 0