时间戳

首页 > 技术文章 > express总结（一）

express总结（一）

tianranhui 2018-12-07 11:59 原文

Express 框架核心特性：

  • 可以设置中间件来响应 HTTP 请求。
  • 定义了路由表用于执行不同的 HTTP 请求动作。
  • 可以通过向模板传递参数来动态渲染 HTML 页面。

express保留了Node原生的功能，添加了一些方法增强原有的功能

安装 Express

  • npm install express --save

几个重要的模块是需要与 express 框架一起安装的

body-parser - node.js 中间件，用于处理 JSON, Raw, Text 和 URL 编码的数据。

cookie-parser - 这就是一个解析Cookie的工具。通过req.cookies可以取到传过来的cookie，并把它们转成对象。

multer - node.js 中间件，用于处理 enctype="multipart/form-data"（设置表单的MIME编码）的表单数据

 

请求和响应

  • Express 应用使用回调函数的参数： request 和 response 对象来处理请求和响应的数据。
app.get('/', function (req, res) {
   // --
})

req.path：获取请求路径
req.query：获取URL的查询参数串
req.route：获取当前匹配的路由


res.append()：追加指定HTTP头
res.send()：传送HTTP响应
res.cookie(name，value [，option])：设置Cookie
opition: domain / expires / httpOnly / maxAge / path / secure / signed
res.clearCookie()：清除Cookie
res.send()：传送HTTP响应

 

路由

  • 路由路由决定了由谁(指定脚本)去响应客户端请求通过路由提取出请求的URL以及GET/POST参数。

　　使用express中的路由访问子页面必须使用use请求

  var server=express();   
  server.listen(8080);
  server.use('/', require('./route/web.js')());
  server.use('/admin/', require('./route/admin.js')());

　　 　require()访问route/admin.js文件，返回路由的页面。

const express=require('express');
module.exports=function (){

  var router=express.Router();

  router.get('/login', (req, res)=>{
    res.render('admin/login.ejs', {});
  });

  router.get('/', (req, res)=>{
    res.render('admin/index.ejs', {});
  });
  
  router.get('/bannerInserOrUpdate',(req,res)=>{
      res.render('admin/bannerInserOrUpdate.ejs')
  });
  return router;
};

Get请求

  • 表单中通过 GET 方法提交两个参数，我们可以使用 server.js 文件内的 
    process_get 
    路由器来处理输入
//index.html
    <form class="" action="/getinfo" method="get">
  用户：   <input type="text" name="user" value=""><br>
  密码：    <input type="text" name="password" value=""><br>
      <input type="submit" name="" value="提交">
    </form>

　　

// server.js
const express=require("express");

var  server= express();
server.get('/index.html', function (req, res) {
   res.sendFile( __dirname + "/" + "index.html" );
});

server.get('/process_get ',function(req,res){
   var response = {
      user:req.query.user,
      password:req.query.password
  };
  console.log(response);
  res.write(JSON.stringify(response));
  res.end();
});

server.listen(8080);

Post请求

  • 通过 POST 方法提交两个参数，我们可以使用 server.js 文件内的 process_post 路由器来处理输入

　　

    <!----index.js--->
    <form class="" action="/process_post" method="post">
  用户：   <input type="text" name="user" value=""><br>
  密码：   <input type="text" name="password" value=""><br>
      <input type="submit" name="" value="提交">
   </form>

 

　server.js文件

const express=require("express");
const bodyParser=require("body-parser");
// 创建 application/x-www-form-urlencoded 编码解析

var  server= express();
server.get('/index.html', function (req, res) {
   res.sendFile( __dirname + "/" + "index.html" );
});

var urlencodedParser = bodyParser.urlencoded({ extended: false })
server.post('/process_post',urlencodedParser,function(req,res){

  response = {
      user:req.body.user,
      password:req.body.password
  };

  res.writeHead(200,{'Content-Type':'text/html;charset=utf-8'});//设置response编码为utf-8
  console.log(response);
  res.write(JSON.stringify(response));
  res.end();
});

server.listen(8080);

 

静态文件

  • Express 提供了内置的中间件 express.static 来设置静态文件如：图片， CSS, JavaScript 等。
  • 你可以使用 express.static 中间件来设置静态文件路径。例如，如果你将图片， CSS, JavaScript 文件放在 public 目录下
server.use(static('./static/'))

 上传文件

html页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文件上传</title>
</head>
<body>
    <h3>文件上传：</h3>
    <form action="/upload" method="post" enctype="multipart/form-data">
        <input type="file" name="imageFile" />
        <br />
        <input type="submit" value="上传文件" />
    </form>
</body>
</html>

server,js页面

var fs = require('fs');
var express = require('express');
var multer  = require('multer');

var upload = multer({dest: 'uploads/'});

var   app= express();
  // 单域单文件上传：input[file]的 multiple != "multiple"
app.post('/upload', upload.single('imageFile'), function(req, res, next) {
    // req.file 是 前端表单name=="imageFile" 的文件信息（不是数组）
    fs.rename(req.file.path, "upload/" + req.file.originalname, function(err) {
        if (err) {
            throw err;
        }
        console.log('上传成功!');
    })
    res.writeHead(200, {
        "Access-Control-Allow-Origin": "*"
    });
    res.end(JSON.stringify(req.file)+JSON.stringify(req.body));
})

app.get('/index', function (req, res) {
   res.sendFile( __dirname + "/" + "index.html" );
});

app.listen(8080);

 

推荐阅读