Node学习-静态web服务

　　通过node服务实现静态网页访问，切换路由(url)地址时，更换页面(读取不同的本地文件并展示在网页上) -> 静态web服务

　　第一步：搭建node服务器

　　　　　　引入http模块 ： 

    var http = require('http');
    http.createServer(function (request, response) {
    response.writeHead(200, {'Content-Type': 'text/plain'});
    response.end('Hello World');
    }).listen(8081);

    console.log('Server running at http://127.0.0.1:8081/');

　　　　　　小窍门：使用快捷方式 ：键入node-http-server；

　　

　　第二步：读取本地文件渲染至页面：

　　　　　　①：获取路由地址，明确需访问文件名称

　　　　　　　　- 引入url模块解析网页路由信息获取当前路由：

　　

    const url = require('url');
    // 1、获取路由地址
    let pathName = url.parse(req.url).pathname;

 

　　　　　　②：读取文件，处理本地文件(页面文件)不存在问题：

　　　　　　　　

  if (pathName != '/favicon.ico') {
    // 2、通过fs模块 读取文件
    fs.readFile('/static' + pathName, async (err, data) => {
      if (err) {
        // 404
        res.writeHead(404, { 'Content-Type': 'text/html;charset="utf-8"' });
        res.end('页面不存在');
      }
    })
  }

 

　　　　　　③：将文件内容渲染至网页页面：

      res.writeHead(200, { 'Content-Type': 'text/html;charset="utf-8"' });

      res.end(data);

 

　　此时会出现样式(.css)，数据(.json)等文件在页面的效果并未出现效果，因为Content-Type（示字符集的设定）非指定类型造成；

　　需使用node-mime(本人2020-12-23日发布内容)文档：

　　　　- 引入fs模块并读取node-mime文件

　　　　

    exports.getFileMime = function (estnames) {
        var data = fs.readFileSync('./data/mime.json');
        mimeObj = JSON.parse(data)
        return mimeObj[estnames];
    }

 

　　在node服务页面引入并在文件渲染之前处理内容：(总)

　　

  const http = require('http');
  const fs = require('fs');
  const common = require('./module/common'); // 引入上一步方法
  const path = require('path');
  const url = require('url');

  common.getFileMime('.json')

  http.createServer(function (req, res) {
    // 1、获取地址
    let pathName = url.parse(req.url).pathname;
    pathName = pathName == '/' ? '/index.html' : pathName;
    // path.extname()  // 可以获取后缀名
    let extName = path.extname(pathName)
    if (pathName != '/favicon.ico') {
      // 2、通过fs模块 读取文件
      fs.readFile('/static' + pathName, async (err, data) => {
        if (err) {
          // 404
          res.writeHead(404, { 'Content-Type': 'text/html;charset="utf-8"' });
          res.end('页面不存在');
        }
        
        let mime = await common.getFileMime(extName)

        res.writeHead(200, { 'Content-Type': '' + mime + ';charset="utf-8"' });

        res.end(data);

      })
    }

  }).listen(3001);

　　　　可正常显示页面以及.css/.js等文件效果。