express 学习

1.安装express 

npm install express@4.17.1

2.安装nodemon

便于调试node.js   不用一直手动重启 

npm install -g nodemon

使用nodemon：node 文件路径  修改为nodemon  文件路径

express创建基本的web服务器步骤：

1.导入express

const express =require('express')

2.创建express实例

const app = express() 

3.启动express实例

app.listen(80,()=>{
      console.log('express server run in http://127.0.0.1')
    }
)

express的请求

1.express的get请求

app.get('/good/get',(req,res)=>{
      res.send({name:'商品名称',id:1})
    }
)

2.express的post请求

app.post('/good/post',(req,res)=>{
res.send()
})

6.获取请求url上的参数

app.get('/goods/get',(req,res)=>{
const param=req.query//得到的是对象
})

7.获取url上的动态参数

app.get('/goods/get/:id',(req,res)=>{
//req.params默认为一个空对象
const params=req.params
res.send(params)
})

8.express向外托管静态资源

app.use(express.static('访问前缀',文件夹路径))

例：publice文件夹中有image、css、js三个文件夹   

使用静态托管之后 可以直接使用 http://127.0.0.1:80/image/......jpg 访问里面的内容（不用添加public）

添加了前缀时 可通过 http://127.0.0.1:80/前缀/image/......jpg 进行访问

托管多个静态文件夹时 可使用多个app.use(express.static(文件目录))

9.express路由

express有3个组成部分 

1.请求类型

2.请求url路径

3.处理函数

app.get/post(url,(req,res)=>{
res.send()//响应客户端
})

路由的匹配会按照路由的定义顺序进行 当请求类型和请求url匹配成功就执行对象的处理函数

路由的最简单用法就是以上写法 直接将路由挂在到app上

但为了便于管理路由 需要将路由进行模块化拆分

express路由模块化

1.创建对应模块的js文件 如goods.js   user.js   role.js  存放在router文件夹中

2.调用express.Router()函数创建路由对象

例：user.js文件

// 1.引入express
const express = require("express");

// 2.创建路由实例对象
var router = express.Router();
// 挂载具体的路由（接口）
router.get("/user/get", (req, res) => {
  res.send({ name: "用户名" });
});
router.get("/user/add", (req, res) => {
  let name = req.params.name;
  res.send({ name: "添加的用户名为" + name });
});
// 3.向外导出路由对象
module.exports = router;

注册路由对象：

1.导入路由模块 

2.注册路由模块

在router文件夹下创建index.js

内容：

const express = require("express");
const app = express();

//引入各个路由模块
const goods = require("./goods");
const user = require("./user");
const role = require("./role");

// 注册使用各个路由模块
app.use(goods, user, role);
// 导出路由表  在app.js中引入使用
module.exports = app;

在app.js中引入路由表 并统一添加前缀 /api

// 1.引入express
const express = require("express");
// 2.创建express实例对象
const app = express();

// 引入路由表
const router = require("./router");
// 统一为路由添加前缀/api
app.use("/api", router);

//3.启动服务器
app.listen(80, () => {
  console.log("run in http://127.0.0.1:80");
});

express中间件

没配置任何处理数据的中间件时 拿到的req.body默认为undefind

body-parser中间件：将客户端请求中的body中的表单数据进行转换（postman中body中的x-www-form-urlencoded类型）

需要转换json格式的可使用内置中间件app.use(express.json())

1.安装中间件 body-parser

npm install body-parser

2.导入中间件

// 导入中间件 处理req.body中的数据
const parser = require("body-parser");

3.使用中间件

// 注册使用中间件
app.use(parser.urlencoded({ extended: false }));

body-parser中间件与内置中间件作用一样  也可以直接使用内置中间件

//内置中间件  不需要安装
app.use(express.urlencoded({ extended: false }));

自定义中间件

需要监听req的data和end

const express = require("express");
// 引入内置querystring模块
const qs = require("querystring");
// 2.创建express实例对象
const app = express();
let str = "";
// 监听data
app.use((req, res, next) => {
  req.on("data", (chunk) => {
    str += chunk;
  });
  // 监听end
  req.on("end", () => {
    // console.log(str);
    //   调用querystring的parser方法
    const body = qs.parse(str);
    // 将req的body属性修改为解析出来的body
    req.body = body;
    next();
  });
});

// 导出中间件
module.exports = app;

// 自定义中间件进行转换
// const myquerystring = require("./util/iqueryString");
// app.use(myquerystring);

使用cors中间件解决跨域：

1.安装中间件

npm install cors

2.导入中间件

const cors = require('cors')

3.在路由前使用中间件

app.use(cors())

使用cors跨域资源共享 

cors响应头：Access-Control-Allow-Orign

允许部分域名下的请求 如 只允许http://baibu.cn的请求

res.setHeader("Access-Control-Allow-Orign", "http://baibu.cn");

res.setHeader("Access-Control-Allow-Orign", '*');//允许所有域名的请求

cors响应头：Access-Control-Allow-Headers

默认情况下，cors仅支持客户端向服务器发送9个请求头：

        Accept、Accept-Language、Content-Language、DPR、Downlink.Save-Data、Viewport-Width、Width、Content-type（仅限于text/plain、multipart/form-data、application/x-www-urlencoded三者之一）

如果需要发送额外的请求头 则需要在服务器端 通过 Access-Control-Allow-Headers对额外的请求头进行声明，否则会请求失败

 // 多个请求头之间使用英文逗号进行分割
    res.setHeader('Access-Control-Allow-Headers','Conten-Type,X-Custom-Header')

cors响应头：Access-Control-Allow-Methods

默认情况下 cors仅支持客户端向服务器发送 GET、POST、HEAD请求

如果想要通过PUT、DELETD等方式进行请求 则服务器要进行指明实际请求允许的HTTP方法

    // 只允许 get post delete head请求方式
    res.setHeader('Access-Control-Allow-Methods', 'POST,GET,DELETE,HEAD')
    // 允许所有请求方式
    res.setHeader('Access-Control-Allow-Methods', '*')

JSONP接口

注意事项：jsonp接口仅支持get请求方式，使用cors中间件解决跨域时  jsonp接口要放在cors之前

// jsonp接口
app.get("/api/jsonp", (req, res) => {
  // 1.获取客户端发送过来的回调函数的名字
  const fnName = req.query.callback;
  // 2.得到要通过JSONP形式发送给客户端的数据
  const data = { name: "hellow", age: 50 };
  // 3.根据前两步得到的数据 拼接出一个函数调用的字符串
  const str = `${fnName}(${JSON.stringify(data)})`;
  //4.将拼接得到的字符串响应给客户端
  res.send(str);
});