Nodejs静态资源服务器

一、http模块

http模块

是node的内置模块，提供http服务

创建一个服务器程序

一个端口只能用于给一个程序监听；8080被当前的server使用了，其他程序就不能用

    let http = require('http');
    let { readFileSync } = require('fs');
    // 1. 创建服务
    let server = http.createServer(function (req, res) {
    // 创建服务器
    console.log('有人访问了'); // 只要访问一次就会打印一次
    // req 对象： request 这里面保存了客户端所有请求的信息
    // res 对象：response 用里面有用户响应客户端请求的方法和属性
    console.log(req.headers.cookie);
    res.end('./index.html'); // 响应客户端请求，并在数据传递结束后断开；
    });
    // 设置端口监听
    server.listen(8080, function () {
    // 服务创建成功并且监听成功会执行这个回调
    console.log('server is running on port 8080')
    });

二、url模块

url模块也是nodejs内置的模块，用来解析请求的url；

    let http = require('http');
    let url = require('url');

    let server = http.createServer((req, res) => {
    // req 包含了全部的请求信息
    // res 包含了全部的响应信息
    console.log(req.url);

    let urlObj = url.parse(req.url); // url  模块上有一个parse方法，可以把url解析成一个对象
    console.log(urlObj);
    // pathname 路径
    // query 问号传参
    // search 查询字符串 比query前面多一个问号
   });

    server.listen(8000, function () {
       console.log('port 8000 is on service');
    });

三、根据请求路径返回不同内容

根据请求的路径不同，返回不同的html
思路：解析请求的url根据不同的路径作出不同的响应；

    let http = require('http');
    let url = require('url');
    let fs = require('fs');

    let server = http.createServer((req, res) => {
    let urlObj = url.parse(req.url, true); // parse方法第二个参数传true是把url中问号传参解析成对象；
    let {pathname, query} = urlObj;
    console.log(pathname);

    // url中的path表示了请求的路径，我们只需要从对应的目录下面把请求的路径对应的资源读取出来，然后响应给客户端即可；

    // 如果客户端请求的是html，我们返回给客户端，客户端收到html后开始解析html，在解析的时候遇到link、img、script这些标签会再次发送http请求给服务端，服务端的监听函数就会再次被触发，只要有一个请求，createServer时传递的函数就要触发一次，而服务端则要继续响应这些请求；

   fs.readFile(`${__dirname + pathname}`,  function (err, data) {
    if (err) {
      res.end('NOT FOUND')
    } else {
      res.end(data);
    }
  })
});
server.listen(8000, () => console.log('port 8000 is on service'));

四、响应与Content-type

1.服务器在响应客户端的请求时需要设置响应内容的内容类型，即在响应头中设置Content-type。客户端收到服务端的响应后会根据这个内容类型来解析。浏览器有一些默认的文件如html、js、css可以不用设置也可以解析；
2.内容类型Content-type: 是一个响应头
3.设置头信息 res.setHeader(头信息, 值)
res.setHeader('Content-Type', 'text/plain;charset=UTF-8');
res.setHeader('set-cookie', 'x=y;'); res.setHeader(头信息, 值) 设置头信息

let http = require('http');
let fs = require('fs');
let url = require('url');

let server = http.createServer((req, res) => {
let urlObj = url.parse(req.url, true);

// 服务器在客户端响应客户端的请求时需要设置内容的内容类型，即content-type，以便于客户端收到响应后知道按照何种规则解析这些内容。浏览器有一些文件，如html、js、css可以不用设置内容类型也可以解析；
// 内容类型：Content-type 是一个响应头：
// 设置响应头：res.setHeader(头信息, 值)
// res.setHeader('Content-type', 'text/plain;charset=utf8');

  let {pathname} = urlObj;
  let contentTypes = {
    html: 'text/html',
    css: 'text/css',
    js: 'text/javascript',
    png: 'image/png'
  };
  let typeReg = /\.(\w+)/g;
  let type = typeReg.exec(pathname)[1];
  console.log(type && contentTypes[type]);
  if (type && contentTypes[type]) {
    res.setHeader('Content-type', contentTypes[type]);
  } else {
    res.setHeader('Content-type', 'text/plain');
  }
  fs.readFile(`${__dirname + pathname}`, function (err, data) {
    if (err) {
      res.end('NOT FOUND')
    } else {
      res.end(data)
    }
  })
});

server.listen(8000, () => console.log('port 8000 is on'))

五、MIME

多用途互联网邮件扩展；每种文件都有自己的MIME类型，这个MIME类型就是服务端响应的时候要设置的Content-Type。

mime依赖包

• 我们一个一个的记录每种文件的content-type很不现实，所以可以借助第三方的mime包；

• mime依赖包中包含了绝大多数文件的mime类型，是一个第三方的扩展；

• 安装mime

    npm install mime --save

使用mime设置内容类型

let mime = require('mime');
let http = require('http');
let url = require('url');
let fs = require('fs');


let server = http.createServer((req, res) => {
  // 1.1 解析url
  let urlObj = url.parse(req.url, true);
  let { pathname } = urlObj;

  // 使用mime设置内容类型：mime.getType(pathname)
  // getType方法会返回pathname对应的内容类型


  let filePath = '';
  if (pathname === '/') {
    filePath = __dirname + '/index.html';
    res.setHeader('Content-Type', 'text/html'); // mime.getType() 不能处理 / ；所以需要单独设置
  } else {
    filePath = __dirname + pathname;
    res.setHeader('Content-Type', mime.getType(pathname));
  }

  fs.readFile(filePath, function (err, data) {
    if (err) {
      res.end('NOT FOUND')
    } else {
      res.setHeader('set-cookie', 'name=mabin;path=/;'); // 在服务端操作cookie；就是设置set-cookie的响应头
      res.end(data);
    }
  })
});

// 2. 监听一个端口号
server.listen(8000, () => console.log('port 8000 is on'));

六、设置响应状态码404

设置状态码

在res对象上有一个statusCode属性，这个属性表示http请求的状态码；通过修改这个属性设置http的状态码；

访问的路径不存在时返回404

判断路径存在不存在
fs.stat(路径, callback) 方法

let http = require('http');
let fs = require('fs');
let url = require('url');
let mime = require('mime');

let server = http.createServer((req, res) => {
  let {pathname} = url.parse(req.url, true);

  console.log(pathname);

  // 判断我们访问的路径存在不存在；
  fs.stat(__dirname + pathname, (err, stats) => {
    // fs.stat() 判断路径是否存在，如果不存在err将会是一个对象，如果路径存在err是null
    if (err) {
      res.statusCode = '404';
      res.end(`${pathname} is not found`);
    } else {
      // 如果代码执行到这里，说明路径有效；

      let filePath = '';
      if (pathname === '/') {
        // 当访问路径是 / 时要返回index.html
        filePath = __dirname + '/index.html';
      } else {
        filePath = __dirname + pathname;
      }

      fs.readFile(filePath, function (err, data) {
        res.end(data)
      })
    }
  })
});
server.listen(8000, () => console.log('port 8000 is on'));