中间件总结

  • 近期学习了 Node.js 的各种中间件,如:express express-static body-parser cookie-parser cookie-session jade ejs 现对这些中间件进行融合,创建一个服务器,算是一个复习总结,包含利用 multer 中间件进行文件上传,multer 的详细 api 可以在这里查看-multer API
  • 不废话,直接贴代码吧:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    //server.js
    const express = require('express');//引入express框架
    const expressStatic = require('express-static');//引入express-static中间件
    const bodyParser = require('body-parser');//引入body-parser中间件
    const cookieParser = require('cookie-parser');//引入cookie-parser中间件
    const cookieSession = require('cookie-session');//引入cookie-session中间件
    const jade = require('jade');//引入jade模板引擎
    const ejs = require('ejs');//引入ejs模板引擎

    var server = express();//创建http服务器

    server.listen(3000);//监听端口3000
    //1.解析cookie
    server.use(cookieParser('jfdifghdrihijdrfhdsefsefo'));//req里面就有req.cookies 和 req.signedCookies

    //使用session
    server.use(cookieSession({name:'sess',keys:['123','abc','123456'],maxAge:2*3600*1000}));

    //post数据
    server.use(bodyParser.urlencoded({extended:false}));

    //用户请求
    server.use('/t',function(req,res,next){
    console.log(req.query,req.body,req.cookies,req.session);
    res.send('olk');
    res.end();

    });

    //static静态页面
    server.use(expressStatic('./www'));


    //upload.html静态文件
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Title</title>
    <style>

    </style>
    </head>
    <body>
    <form action="http:/xxx.xxx.xxx.xxx:3000/t" method="post" enctype="multipart/form-data">
    <input type="file" name="f1" />
    <button>提交</button>

    </form>
    <script>

    </script>
    </body>
    </html>
  • 在浏览器请求页面 http://xxx.xxx.xxx.xxx:3000/?q=323234&b=12345 的结果截图:

  • pic
    结果截图

    利用 multer 中间件上传文件

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    //server.js
    const express = require('express');//引入express框架
    const expressStatic = require('express-static');//引入express-static中间件
    const bodyParser = require('body-parser');//引入body-parser中间件
    const cookieParser = require('cookie-parser');//引入cookie-parser中间件
    const cookieSession = require('cookie-session');//引入cookie-session中间件
    const jade = require('jade');//引入jade模板引擎
    const ejs = require('ejs');//引入ejs模板引擎
    const fs = require('fs');//引入js模块
    const path = require('path');//引入path模块
    const multer = require('multer');//引入multer中间件
    //In an average web app, only dest might be required, and configured as shown in the following example.
    var upload = multer({dest: 'uploads/'});
    var server = express();//创建http服务器

    server.listen(3000);//监听端口3000
    //1.解析cookie
    server.use(cookieParser('jfdifghdrihijdrfhdsefsefo'));//req里面就有req.cookies 和 req.signedCookies

    //使用session
    server.use(cookieSession({name:'sess',keys:['123','abc','123456'],maxAge:2*3600*1000}));

    //post数据
    //server.use(bodyParser.urlencoded({extended:false}));//不能处理multipart/form-data类型表单
    server.use(upload.single('f1'));//.single(fieldname)
    //Accept a single file with the name fieldname. The single file will be stored in req.file.

    //用户请求
    server.use('/t',function(req,res,next){
    //console.log(req.query,req.body,req.cookies,req.session,req.file);
    var new_file_path = req.file.path+path.parse(req.file.originalname).ext;//拼一个新文件名出来
    fs.rename(req.file.path,new_file_path,function(err){});//重命名文件

    res.send('olk');
    res.end();

    });

    //static静态页面
    server.use(expressStatic('./www'));
  • 效果图:

  • pic
    multer上传文件