nodejs项目实战教程09——封装静态Web服务器并进行路由管理

nodejs项目实战教程09——封装静态Web服务器并读取路由

1. 封装静态Web服务器

(1)复制上一章节《nodejs项目实战教程08——创建静态Web服务器》中的demo10中的文件到一个新创建的demo11文件夹中
(2)修改module/common.js为module/routes.js
(3)在routes.js中创建读取默认路径资源的方法static,并将app.js中http.createServer里的代码复制到其中进行封装:

const fs = require('fs')
const http = require('http')
const path = require('path')

// 私有方法
let getFileMine = function(extname){
    
    
  // 同步获取数据
  let data = fs.readFileSync('./data/mime.json')
  let mimeObj = JSON.parse(data.toString())
  // 变量名属性只能通过数组的形式进行访问
  console.log(mimeObj[extname])
  return mimeObj[extname]
}

exports.static = function(req,res,staticPath){
    
    
  // 1.获取地址
  let pathname = req.url
  // 解析地址,除去地址?后的字符
  pathname = (pathname.split('?'))[0]
  // 默认加载页面
  pathname = pathname === '/'?'/index.html':pathname

  // 获取文件后缀
  let extname = path.extname(pathname)
  // 2.通过fs模块读取文件
  if(pathname !== '/favicon.ico'){
    
    
    console.log(pathname)
    // console.log(req)
    fs.readFile('./' + staticPath + pathname,(err,data)=>{
    
    
      if(err){
    
    
        res.writeHead(404, {
    
    'Content-Type': 'text/html;charset="utf-8"'});
        res.end('这个页面不存在');
      }
      // 根据路径后缀返回content-type
      // let mime = common.getMime(extname);
      let mime = getFileMine(extname);
      res.writeHead(200, {
    
    'Content-Type': ''+ mime +';charset="utf-8"'});
      // 3.返回路径下文件的内容
      res.end(data);
    })
  }
}

注意引入需要的http和path模块,并且getFileMine此时需要变成私有方法。
(4)在app.js中使用最新的static方法:

// 创建一个web服务器
// 1.可以访问web服务器上的网站
// 2.可以下载web服务器上的文件
const http = require('http')
const routes = require('./module/routes')

http.createServer(function (req, res) {
    
    
  // 创建静态服务
  routes.static(req,res,'static')
}).listen(3000);

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

(5)执行node app.js:

在这里插入图片描述

2. 路由管理

(1)尝试加入以下代码,在浏览器中修改地址
在这里插入图片描述
在这里插入图片描述
(2)app.js批量添加路由

if(pathname === '/login'){
    
    
      res.writeHead(200, {
    
    'Content-Type': 'text/html;charset="utf-8"'});
      res.end('执行登录');
    }
    if(pathname === '/register'){
    
    
      res.writeHead(200, {
    
    'Content-Type': 'text/html;charset="utf-8"'});
      res.end('执行注册');
    }
    if(pathname === '/admin'){
    
    
      res.writeHead(200, {
    
    'Content-Type': 'text/html;charset="utf-8"'});
      res.end('处理后的业务逻辑');
    }
    else{
    
    
      res.writeHead(404, {
    
    'Content-Type': 'text/html;charset="utf-8"'});
      res.end('该页面不存在');
    }

但是这样会有一个问题:routes.js的static()和app.js里面的路径会冲突,即代码执行完routes.js的static()会接着执行app.js里面的if判断,当你给路径/index.html就会报错

(3)解决异常的思路是,让static使用同步读取文件方法readFileSync,并且最终返回一个布尔值,如果路径走了static()返回true,没走的话返回false,然后让app.js调用的static接收返回的布尔值,如果接收到true,那么就不用走if条件,如果接收到false,那么走if条件。

routes.js:

const fs = require('fs')
const http = require('http')
const path = require('path')

// 私有方法
let getFileMine = function(extname){
    
    
  // 同步获取数据
  let data = fs.readFileSync('./data/mime.json')
  let mimeObj = JSON.parse(data.toString())
  // 变量名属性只能通过数组的形式进行访问
  console.log(mimeObj[extname])
  return mimeObj[extname]
}

exports.static = function(req,res,staticPath){
    
    
  const {
    
    url} = req
  const {
    
    host} = req.headers
  const myURL = new URL(url,`http://${
      
      host}`)
  pathname = myURL.pathname
  // 默认加载页面
  pathname = pathname === '/'?'/index.html':pathname
  // 获取文件后缀
  let extname = path.extname(pathname)
  // 2.通过fs模块读取文件
  if(pathname !== '/favicon.ico'){
    
    
    try {
    
    
      let data = fs.readFileSync('./' + staticPath + pathname)
      if(data){
    
    
        let mime = getFileMine(extname);
        res.writeHead(200, {
    
    'Content-Type': ''+ mime +';charset="utf-8"'});
        res.end(data);
        return true
      }
      return false
    } catch (error) {
    
    
      return false
    }
  }
}

app.js:

// 创建一个web服务器
// 1.可以访问web服务器上的网站
// 2.可以下载web服务器上的文件
const http = require('http')
const routes = require('./module/routes')

http.createServer(function (req, res) {
    
    
  // console.log('req',req.headers)
  const {
    
    url} = req
  const {
    
    host} = req.headers
  const myURL = new URL(url,`http://${
      
      host}`);
  console.log('myURL',myURL)
  // 创建静态服务
  let flag = routes.static(req,res,'static')

  pathname = myURL.pathname

  if(!flag){
    
    
    if(pathname === '/login'){
    
    
      res.writeHead(200, {
    
    'Content-Type': 'text/html;charset="utf-8"'});
      res.end('执行登录');
    }
    else if(pathname === '/register'){
    
    
      res.writeHead(200, {
    
    'Content-Type': 'text/html;charset="utf-8"'});
      res.end('执行注册');
    }
    else if(pathname === '/admin'){
    
    
      res.writeHead(200, {
    
    'Content-Type': 'text/html;charset="utf-8"'});
      res.end('处理后的业务逻辑');
    }
    else{
    
    
      res.writeHead(404, {
    
    'Content-Type': 'text/html;charset="utf-8"'});
      res.end('该页面不存在');
    }
  }

}).listen(3000);

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

注意,这里获取文件后缀的方式做了修改,使用myURL可以获取更完整的路由信息:

const {
    
    url} = req
const {
    
    host} = req.headers
const myURL = new URL(url,`http://${
      
      host}`);
pathname = myURL.pathname

下一章 nodejs项目实战教程10——EJS模板引擎、get、post

猜你喜欢

转载自blog.csdn.net/qq_39055970/article/details/121796508