nodejs初步实现静态资源服务器功能

Web资源服务器简介

首先，我们先了解一下Web资源：
所谓 Web 资源即放在 Internet 网上供外界访问的文件或程序，又根据它们呈现的效果及原理不同，将它们划分为静态资源和动态资源。

什么是静态资源

静态资源是浏览器能够直接打开的，一个 js 文件，在打开方式中选择 IE 浏览器打开，浏览器可以直接打开没有出现问题，那么就说明它是一个静态资源。html 文件、css 文件、 js 文件等这些都是静态资源。

什么是动态资源

动态资源是有一些资源浏览器是不能够直接打开的，但是经过翻译之后浏览器能够打开的资源称之为动态资源。比如说 jsp 文件、servlet、php、ASP 等这些都是动态资源。

静态资源和动态资源的区别

Web服务器

• Web服务器一般指网站服务器，是指驻留于因特网上某种类型计算机的程序，可以处理浏览器等Web客户端的请求并返回相应响应，也可以放置网站、数据文件；
• 当Web浏览器（客户端）连到服务器上并请求文件时，服务器将处理该请求并将文件反馈到该浏览器上，附带的信息会告诉浏览器如何查看该文件（即文件类型）。服务器使用HTTP（超文本传输协议）与客户机浏览器进行信息交流；
• Web服务器的作用是接收客户端的请求，给客户端作出响应。

端口号

• 所谓的端口，就好像是门牌号一样，客户端可以通过ip地址找到对应的服务器端，但是服务器端是有很多端口的，每个应用程序对应一个端口号，通过类似门牌号的端口号，客户端才能真正的访问到该服务器。为了对端口进行区分，将每个端口进行了编号，这就是端口号；

• 端口号的主要作用是表示一台计算机中的特定进程所提供的服务 。网络中的计算机是通过IP地址来代表其身份的，它只能表示某台特定的计算机，但是一台计算机上可以同时提供很多个服务，如数据库服务、FTP服务、Web服务等，我们就通过端口号来区别相同计算机所提供的这些不同的服务一个

• 端口号是不固定的，即可以由用户手工可以分配（当然，一般在软件编写时就已经定义）。

HTTP报文头

HTTP报文是面向文本的，报文中的每一个字段都是一些ASCII码串，各个字段的长度是不确定的。HTTP有两类报文：请求报文和响应报文。

请求报文

一个HTTP请求报文由请求行（request line）、请求头部（header）、空行和请求数据4个部分组成，下图给出了请求报文的一般格式。

响应报文

http响应报文由响应行，响应头，响应体三部分组成。

初步实现服务器功能

通俗写法

1.引入http模块：

const http = require('http');

2.创建服务器实例对象：

let server = http.createServer();

3.绑定请求事件

server.on('request',(req,res)=>{
    res.end('hello');
})

4.监听端口

server.listen(3000,()=>{
    //测试服务是否连接
    console.log('running...')
})

浏览器访问的方式是：localhost:端口号

简化写法

第一种访问方式：通过 localhost:端口号访问

http.createServer((req,res)=>{
    res.end('你好');
}).listen(3000,()=>{
    console.log('running...')
});

我们会发现，中文字符‘你好’会相应在页面上，但是它是乱码，解决办法：设置响应报文头

    res.writeHead(200,{
    'Content-Type':'text/plain;charset=utf8'
});

第二种访问方式：通过 ip地址:端口号 访问

http.createServer((req,res)=>{
    res.end('hello');
}).listen(3000,'ip地址',()=>{
    console.log('running...');
})

初步实现静态资源

处理请求路径的分发：
req的对象是Class：http.IncomingMessage的实例对象
res的对象是Class：http.SeverResponse的实例对象

const http = require ('http');

http.createServer((req,res)=>{
    if(req.url.startsWith('/index')){
        res.end('index')
    }else if(req.url.startsWith('/about')){
        res.end('about')
    }else{
        res.end('no content');
    }
}).listen(3000,()=>{
    console.log('running...');
})

res.write()和res.end()区别

• write方法向客户端响应内容，可以写多次
• end方法用来完成响应，只能执行一次
• 两种方法可以同时使用

    if(req.url.startsWith('/index')){
        res.write('hello');
        res.write('world');
        res.end('index')
    }

初步实现静态资源服务器的功能

/**
 * 初步实现静态资源服务器的功能
 */
const http = require('http');
const fs = require('fs');
const path = require ('path');

http.createServer((req,res)=>{
    if(req.url.startsWith('/index')){
        fs.readFile(path.join(__dirname,'www','index.html'),'utf8',(err,fileContent)=>{
            if(err){
                res.end('sever error');
            }else{
                res.end(fileContent);
            }
        });
    }else if(req.url.startsWith('/about')){

    }else if(req.url.startsWith('/list')){

    }
}).listen(3000,()=>{
    console.log('running');
})

我们会发现，后面的方法都是一样的，所以可以考虑封装方法

封装方法

/**
 * 初步实现静态资源服务器的功能
 */
const http = require('http');
const fs = require('fs');
const path = require ('path');


let readFile = (file,res)=>{
    fs.readFile(path.join(__dirname,'www',file),'utf8',(err,fileContent)=>{
        if(err){
            res.end('sever error');
        }else{
            res.end(fileContent);
        }
    })
}
http.createServer((res,req)=>{
    if(req.url.startsWith('/index')){
        readFile('index.html',res);
    }else if(req.url.startsWith('/about')){
        readFile('about.html',res);
    }else if(req.url.startsWith('/list')){
        readFile('list.html',res);
    }else{
        res.end('页面被狗狗叼走了')
    }
}).listen(3000,()=>{
    console.log('running...')
})

案例–实现成绩查询功能

利用nodejs实现成绩查询功能