静态Web服务器

知识点

1. Web服务器是可以向发出请求的浏览器提供文档的程序。

1、服务器是一种被动程序：只有当Internet上运行其他计算机中的浏览器发出的请求时，服务器才会响应。
2、最常用的Web服务器是Apache和Microsoft的Internet信息服务器（Internet Information Services，IIS）。
3、Internet上的服务器也称为Web服务器，是一台在Internet上具有独立IP地址的计算机，可以向Internet上的客户机提供WWW、Email和FTP等各种Internet服务。

4、Web服务器是指驻留于因特网上某种类型计算机的程序。当Web浏览器（客户端）连到服务器上并请求文件时，服务器将处理该请求并将文件反馈到该浏览器上，附带的信息会告诉浏览器如何查看该文件（即文件类型）。服务器使用HTTP（超文本传输协议）与客户机浏览器进行信息交流，这就是人们常把它们称为HTTP服务器的原因。
Web服务器不仅能够存储信息，还能在用户通过Web浏览器提供的信息的基础上运行脚本和程序。

2. 读取到页面的数据后不需要将buffer转换为string类型，浏览器会自动解析，否则图片加载失败
3. 浏览器加载解析后图片的后缀jpg与图片后缀不符，使用mime.json文件修改后缀名
4. 此外，使用Nodejs工具模块中的path模块，使用 path.extname(p)

返回路径中文件的后缀名，即路径中最后一个'.'之后的部分。如果一个路径中并不包含'.'或该路径只包含一个'.'且这个’.'为路径的第一个字符，则此命令返回空字符串。

步骤

静态web服务器的目录结构：

1. 先新建静态web服务器文件夹
2. 新建static静态资源目录，将页面相关内容存入
3. cnpm init，生成package.json文件，里面是自己填写的各种信息
4. 新建app.js作为项目的启动文件（主文件）

const http = require("http");
let server=require("./model/server");//方法封装在derver模块中
http.createServer(server).listen(8080, "localhost", () => {
    console.log("http://127.0.0.1:8080/");//我的 本机端口号
});

5. 新建model文件夹，其中存放模块化代码。

• mime.json

直接添加（代码过多只截取主要部分）

{……
  ".jpe":"image/jpeg" ,
  ".jpeg":"image/jpeg" ,
  ".jpg":"image/jpeg" ,
  ".jpz":"image/jpeg" ,
  ".js":"application/x-javascript" ,
  ……
}

• server.js
  将http请求方法封装在server.js中以减少app.js页面代码

const url = require("url");
const fs = require("fs");
const pathmodule = require("path");//请求path模块（想获取后缀名）
let mime = require("./mime.json");//请求后缀名json
module.exports = (req, res) => {//暴露方法
    let path = url.parse(req.url);  //解析路径
    let pathname = path.pathname;
    if (pathname != "/favicon.ico") {//让浏览器只加载一次
        //加载首页
        if (pathname == "/") {//默认打开页面
            pathname = "index.html";
        }
        //现在数据可以打印出去  但是文件的类型不一致   text/html   text/css  text/javascript 等等不一致
            //根据后缀名 确认类型

        let hname = pathmodule.extname(pathname);//取后缀名
        let extname = mime[hname];
        //利用反编译配置响应头
        res.writeHead(200, { "Content-Type": `${extname};charset=utf-8` }); 
        fs.readFile("static/" + pathname, (err, data) => {   //根据目录找到对应的文件
            if (err) {
                throw err;
            }
            res.write(data);
            res.end();
        });
    }

}