Nodejs静态资源服务器

1、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')
    });

复制代码

2、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');
    });
复制代码

3、根据请求路径返回不一样内容

根据请求的路径不一样，返回不一样的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'));
复制代码

4、响应与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'))

复制代码

5、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'));

复制代码

6、设置响应状态码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'));


复制代码