Node.js的内置功能-Web编程-IT技术

fs模块

fs模块最重要的一个功能就是异步读取文件（readFile），第一个参数文件，第二个参数是回调函数

我们看下面的一个案例

var http = require("http");
var fs = require("fs");
// 创建服务器
var server = http.createServer(function(req,res){
  fs.readFile("./1.html",function(err,data) {
    res.end(data)
  })
})
// 监听
server.listen(3000,function(){
    console.log("监听3000端口")
})

此时浏览器看到界面

其中，data为文件的内容

路由

上面的案例，我无论输入什么URL都会显示这个页面

此时我们就可以利用这个特性完成一个路由设计

我们可以通过req.url得到用户输入的URL的地址

var http = require("http");
var fs = require("fs");
// 创建服务器
var server = http.createServer(function(req,res){
    res.setHeader("Content-type","text/html;charset=utf8");
    if(req.url==="/1.html"){
        fs.readFile("./1.html",function(err,data){
            res.end(data)
        })
    }else if(req.url==="/2.html"){
        fs.readFile("./2.html",function(err,data){
            res.end(data)
        })
    }else{
        res.end("无页面")
    }
})
// 监听
server.listen(3000,function(){
    console.log("监听3000端口")
})

比如此时我们访问1.html文件

访问2.html文件

通过路由进行页面的读取，这个就是顶层路由设计

顶层路由设计：

物理文件层次和URL是没有任何关系的
NodeJS是可以做顶层路由设计的！一个页面URL是可以自定义的
用户的输入的URL是可以映射任何HTML页面的

顶层路由设计会遇到的问题

此时我们在1.html文件中添加一个图片

现页面中只有文字的展示，没有图片的展示，但是HTML结构中是有img标签的，那么为什么没有加载出来，是因为该图片的url路径是没有物理文件夹的

我们可以发现现在这张图片的真是物理地址是http://127.0.0.1:3000/1.png，但是图片物理存放地址是在F: ode/1.png，所以一定不能按需加载

解决办法就是对每一张图片进行请求

var http = require("http");
var fs = require("fs");
// 创建服务器
var server = http.createServer(function(req,res){
    // 设置字符集
    res.setHeader("Content-Type","text/html;charset=UTF8");
  //对页面的内容进行请求
    if(req.url === "/1.html") {
      fs.readFile("./1.html",function(err,data) {
        res.end(data)
  })
  //对页面的图片地址进行请求
    } else if(req.url=="/1.png"){
      res.setHeader("Content-Type","image/jpg");
      // 读取图片
      fs.readFile("./1.png",function(err,data){
        res.end(data)
      })
    }else{
      res.end("无页面显示")
    }
  })
  
// 监听
server.listen(3000,function(){
    console.log("监听3000端口")
})

此时就可以看到图片正常加载

需要注意的是使用NodeJS进行请求文件的时候需要设置对应的ContentType，就是文件的请求类型

常见的请求类型

text/html:HTML格式

text/css:CSS格式

text/plain:纯文本格式

text/xml:XML格式

image/gif:gif图片格式

image/jpeg:jpg图片格式

image/png:png图片格式

res.setHeader("Content-Type","text/html;charset=UTF8") //HTML
res.setHeader("Content-Type"," text/css ") //CSS
res.setHeader("Content-Type"," image/png ") //png格式的图片

本文摘自：https://www.cnblogs.com/

Node.js的内置功能2021-10-18 17:48:02

fs模块

路由

顶层路由设计会遇到的问题

Node.js的内置功能
2021-10-18 17:48:02