Express框架
首先我们先安装Node.js
0.基于express框架，创建项目。
创建工程目录
mkdir myNodeExpress01
#创建项目
cd myNodeExpress01
#进入目录
通过npm init命令给你的应用创建一个package.json 文件。（包含工程的基本信息，以及工程模块的依赖列表）
npm init
#具体请看2_node NPM的使用。
在项目的根目录下安装Express并将其保存在依赖列表中。
npm install express --save
在项目的根目录下创建index.js文件，并在其中调用express 框架提供的方法，搭建web服务器。
//引入express模块
const express=require('express');
const webApp=express();
const port=2222;
// 根据不同的请求处理业务
webApp.get('/',(req,res)=>{
res.send('这是我的第一个express 应用');
})
webApp.get('/login',(req,res)=>{
res.send('这是我的的登录');
})
webApp.listen(port,()=>{
console.log(`server is running at http://127.0.0.1:${port}`);
});
以上是使用express 搭建一个基本的Web服务器的代码示例.
1.快速入门
npm提供了大量的第三方模块，其中不乏有许多web框架，之所以选择使用Express作为开发框架，因为他是目前最稳定，使用最广泛，而且Node.js官方推荐的唯一一个WEB开发框架。
Express除了为http模块提供了更高层的接口外，还实现了许多功能，其中包括：
- 路由控制
- 模板解析
- 动态视图
- 用户会话
- CSRF保护
- 静态文件服务
- 错误控制器
- 访问日志
- 缓存
-
插件支持
Express 不是一个无所不能的全能框架，他只是一个轻量级的web框架，多数功能只是对HTTP协议中常用的操作的封装，更多的功能需要插件或者整合其他模块来完成。
1.1 安装express
$ npm install -g express //全局安装
等待安装完成后，我们可以在命令行下通过express 命令快速创建一个项目。
在使用以下命令安装express-generator（应用构造器）
应用程序生成器：
我们可以通过npx 命令来安装express 应用程序生成器。
mkdir myNodeExpress02
cd myNodeExpress02
npx express-generator
也可以使用npm 命令安装Express应用程序生成器
npm install -g express-generator
$ npm install express-generator -g
1.2 建立工程&启动工程（使用express-generator应用构造器创建项目）
通过以下命令建立网站的基本解构
$ express projectName
// projectName 要创建的项目名称
当前目录下会出现一个projectName的子目录，并且创建一些文件：
create : projectName/
create : projectName/public/
create : projectName/public/javascripts/
create : projectName/public/images/
create : projectName/public/stylesheets/
create : projectName/public/stylesheets/style.css
create : projectName/routes/
create : projectName/routes/index.js
create : projectName/routes/users.js
create : projectName/views/
create : projectName/views/error.jade
create : projectName/views/index.jade
create : projectName/views/layout.jade
create : projectName/app.js
create : projectName/package.json
create : projectName/bin/
create : projectName/bin/www
// 执行如下操作
change directory:
$ cd projectName //进入项目的根目录
install dependencies:
$ npm install //安装项目需要的依赖
run the app:
$ DEBUG=projectname:* npm start //启动项目
项目启动后，在浏览器输入http://localhost:3000，访问项目。
1.3 工程结构
1.3.1 app.js 和入口文件
app.js 是工程的配置文件，
var createError = require('http-errors');
// http错误处理模块
var express = require('express');
// express 模块
var path = require('path');
var cookieParser = require('cookie-parser');
// cookie 模块
var logger = require('morgan');
// 日志模块
// 引入的路由模块
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var app = express();
// 视图引擎的设置
app.set('views', path.join(__dirname, 'views'));
// 设置视图目录
app.set('view engine', 'ejs');
// 设置模板引擎 官方提供了jade ，ejs;ejs 更接近于HTML语法，推荐使用
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/www 是工程的入口文件。
// 以下文件内容相较于实际项目有缩减
/**
* Module dependencies.
*/
var app = require('../app');
var debug = require('debug')('projectname:server');
var http = require('http');
/**
* Get port from environment and store in Express.
*/
var port = normalizePort(process.env.PORT || '3000');
app.set('port', port);
/**
* Create HTTP server.
* 创建web服务器
*/
var server = http.createServer(app);
/**
* Listen on provided port, on all network interfaces.
* 添加web 服务器端口监听
*/
server.listen(port,function(){
console.log('server is running ,port is '+port);
});
1.3.2 public 静态资源目录
public中存放站点所需要的静态资源，比如图片,css,js,font等
配置静态资源目录，进入app.js 文件，使用以下代码：
// 静态资源目录的配置 静态资源挂载
app.use('/static',express.static(path.join(__dirname, 'public')));//给静态资源设置虚拟目录
app.use(express.static(path.join(__dirname, 'public')));//默认
1.3.3 views 视图（ejs模板）目录
此目录下存放视图文件。
1.3.4 routes 路由文件目录
此目录下存放路由文件。
2. 路由控制
路由是为了处理不同的请求（url）执行的不同的操作。
我们要为路由提供请求的URL和其他需要的GET，POST，以及参数，之后路由需要根据这些数据来执行相应的代码。
2.1 工作原理
express 是一个典型的MVC架构，浏览器发起请求，有路由控制器接受，根据不同的路径定向到不同的控制器，控制器处理用户的具体请求（具体业务），可能会访问数据库中的对象，即模型部分。控制器还要访问模板引擎，生成视图HTML，最后再由控制器返回给浏览器，完成一次请求。
2.2创建路由规则
在routes/index.js 文件中，有个已有的路由规则 router.get('/',function(){});
router.get('/',function(req,res){
res.send('123332132123132123');
})
2.3路径匹配规则
//router.get('/a/:parm1/:parm2');
// http://localhost:3000/a/parm1_val/parm2_val
// 取值时，使用req对象中的params对象取值。
router.get('/a*/:username',function(req,res){
res.send('参数:'+req.params.username);
})
路径规则/a/:username会被自动编译为正则表达式.路径参数可以在响应函数中通过req.params 的属性访问。
2.4 REST风格的路由规则
Express 支持REST风格的请求方式，REST（表征状态转移Representational State Transfer）,它是一种基于HTTP协议的网络应用的接口风格，利用HTTP的方法实现统一风格接口的服务。HTTP协议定义了以下8中标准的方法：
- GET：请求获取指定资源（获取数据）；
- HEAD：请求指定资源响应头 （获取响应头信息）；
- POST：向指定的资源提交数据（发送数据）；
- PUT：请求服务器存储的一个资源 （存储数据）；
- DELETE：请求服务器删除指定资源 (删除数据)；
- TRACE：回显服务器收到的请求，主要用于测试或者诊断
- CONNECT：HTTP/1.1协议中预留给能够将连接改为管道方式的代理服务器。
- OPTIONS：返回服务器支持的请求方法。
我们最常用的是GET,POST,PUT 和DELETE 方法。根据REST设计模式，这4种方法通常分别用于实现以下功能： - GET：获取
- POST：新增
- PUT：更新
- DELETE： 删除
Express 对每种HTTP请求方法都设计了不同的路由绑定函数。
| 请求方式 | 绑定函数 |
|---|---|
| GET | app.get(path,callback) |
| POST | app.post(path,callback) |
| PUT | app.put(path,callback) |
| DELETE | app.delete(path,callback) |
| PATCH | app.patch(path,callback) |
| TRACE | app.trace(path,callback) |
| CONNECT | app.connect(path,callback) |
| OPTIONS | app.options(path,callback) |
| 所有方法 | app.all(path,callback) |
需要注意的是app.all函数，它支持把所有的请求方式绑定到同一个响应函数。
2.5 控制权转移
//routes/user.js
var users={
username:'huskyuncle',
password:'123456'
}
router.all('/:username',function(req,res,next){
// 检查用户是否存在
if(users['username']==req.params.username){
// 用户存在
next();
}else{
next(new Error(req.params.username+' 找不到数据'));
}
})
router.get('/:username',function(req,res){
// 用户存在,直接展示用户数据
res.send(JSON.stringify(users['username']+users['password']));
})
router.all定义的这个路由规则实际上起到了中间件作用，把相似的请求的相同部分提取出来，有利于代码维护其他next方法如果接受了参数，也就代表发生错了，这种方式可以把错误检查分段化，降低代码的耦合度。
3. 模板引擎
模板引擎（Template Engine）是一个从页面模板根据一定的规则生成HTML的工具。
Express 内置ejs和jade 两种模板引擎（建议使用ejs），我们在Express框架中使用时，在app.js中通过以下语句设置了模板引擎和页面模板的位置：
app.set('views',__dirname+'/views');//设置页面模板位置
app.set('views engine','ejs');//设置使用的模板引擎
渲染页面时，我们在响应对象函数中使用res.render()渲染模板
router.get('/',function(req,res){
// render(viewName,viewData);
// *viewName 视图名称
res.render('index',{data:'数据'});
})
ejs的标签系统，常用三种标签
- <% code %> JavaScript代码
- <%= code %> 显示替换过HTML特殊字符的内容|输出变量内容
- <%- code %> 显示原始的HTML内容
- <%- include('common/header',data); %> 在模板页中引入另外一个模板页，并且传输data参数给指定的模板页面（common/header）。
