Node.js静态资源服务器

WangYunN
140 阅读3分钟

yarn 安装依赖包 用来管理依赖包 yarn 速度更快

  • yarn 等同于 npm i
  • yarn add 依赖包 --dev 安装开发依赖
  • yarn add 依赖包 --save 安装生成依赖
  • yarn remove 依赖 卸载依赖包

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

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

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

url模块 也是Node.js内置的模块 用来解析请求的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解析成一个对象
    consloe.log(urlObj);
    //pathname 路径
    //query 问号传参
    //search查询字符串 比query前面多一个问号
    
});
server.listen(8000,function(){
    console.log('port 8000 is on service')
});

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

思路： 根据请求的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

服务器在响应客户端的请求时需要设置响应内容的内容类型 即在响应头中设置Content-type 客户端收到服务器端的响应后会根据这个内容内容类型来解析 浏览器有一些默认的的文件如 html、js、css 可以不用设置也可以解析

  • 内容类型 Content-type:是一个响应头
  • 设置头信息 res.setHeader(头信息，值)
  • res.setHeader('Content-Type','text/plain;charest = UTF-8');
  • res.setHeader('set-cookie','x= y');
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);
    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类型 这个MIME类型就是服务端响应的时候要设置的Content-Type

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

安装

yarn add mime --save

使用mime设置内容类型

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);

  res.setHeader('Content-type', mime.getType(pathname));
  fs.readFile(__dirname + pathname, function (err, data) {
    if (err) {

    } else {
      res.end(data)
    }
  })
});

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'));
avatar
文章
阅读
粉丝