前言
这是该系列文章的第三篇，主要介绍npm和express框架的应用(下一篇使用express做一个完整的案例)
npm
小demo直接用几个js文件可以搞定，但是项目级别的目录还是需要有规范的，也基本上都需要安装第三方包，npm就是这样一个包管理器。
-
新建一个英文命名的文件夹，进入后，在终端运行npm init -y 进行项目初始化
-
全局安装依赖 npm i -g 包名
-
安装开发依赖 npm i -D 包名
-
安装生产依赖 npm i -S 包名
-
卸载依赖包 npm uninstall 包名
-
npm update升级依赖包版本
-
npm list查看依赖的当前版本
-
npm search查找包含该字符串的依赖包
express
express 是一个前几年比较流行的Node.js框架，现在逐步被koa2,egg取代，但还是有必要学习一下的。koa2基于express封装，egg基于koa2封装。官网：http://expressjs.com/
基本使用
上文用原生http模块搭建的服务器，这次用express，它内置路由，比原生更强大.但有一点，默认不支持post请求，需要依赖第三方插件（body-parser,formidable…）
// 1. 引包
var express = require('express')
//获取服务器对象
var app = express()
//设置路由，访问首页显示 hello express
app.get('/',function(req,res){
res.send('hello express');
})
app.get('/about', function (req, res) {
// 在 Express 中可以直接 req.query 来获取查询字符串参数
res.send(req.query)
})
//设置监听
app.listen(3000,function(){
console.log('run server___');
})
静态资源开放
有些时候，服务器上的静态资源我们允许直接访问（如css,js,img）
var express = require('express');
var app = express();
//开放静态资源 如原始路径为/public/1.jpg 现在可以/1.jpg 访问 ，少了一层目录
app.use(express.static('public'))
app.listen(3000, function() {
console.log('run server__')
})
404拦截处理
express 对于没有设定的请求路径，默认会返回 Cat not get xxx,如果你想要定制这个 404,需要通过中间件来配置.
// 写在最后一个路由后边
app.use(function (req, res) {
// 所有未处理的请求路径都会跑到这里
// do something
}
处理post请求
下面用两个完整的示例，介绍express+中间件处理post请求的过程
- Node.js开发显示界面一般放在views文件夹内，这是路由渲染时候的默认查找
- 未必是html，看模板引擎而定，ejs模板引擎用的就是xxx.ejs
step 1–安装依赖
- npm i express
- npm i body-parser //处理post请求
- npm i formidable //处理post请求，也可以处理上传 和 body-parser 二选一就好
- npm i art-template //模板引擎
- npm i express-art-template //与express结合的模板引擎
step 2 --配置body-parser和模板引擎
// 1. 引包
var express = require('express')
var bodyParser = require('body-parser')
//获取服务器对象
var app = express()
//配置bodyParser
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())
//整合模板引擎
app.engine('html', require('express-art-template'))
app.get('/', function (req, res) {
res.render('form.html');
})
//处理表单的post请求，req.body用来接收数据
app.post('/post', function (req, res) {
res.send(req.body);
})
//设置监听
app.listen(3000,function(){
console.log('run server___');
})
step 3 --编写form.html代码
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>title</title>
</head>
<body>
<form action="/post" method="post">
<p>姓名<input type="text" name="name"></p>
<p>年龄<input type="text" name="age"></p>
<p><input type="submit"></p>
</form>
</body>
</html>
使用formidable替代body-parser
// 1. 引包
var express = require('express')
var formidable = require('formidable');
//获取服务器对象
var app = express()
//整合模板引擎
app.engine('html', require('express-art-template'))
app.get('/', function (req, res) {
res.render('form.html');
})
app.post('/post', function (req, res) {
var form = new formidable.IncomingForm();
//可以自己打印看看回调函数里边三个参数是什么
form.parse(req, function (err, fields, files) {
res.send(fields);
})
})
//设置监听
app.listen(3000, function () {
console.log('run server___')
})
