中间件设置静态资源目录

文章目录

为什么要设置静态资源目录
设置静态资源代码示例

为什么要设置静态资源目录

服务器中的代码，对于外部来说都是不可见的，
所以我们写的html页面，浏览器无法直接访问
如果希望浏览器可以访问，则需要将页面所在的目录设置静态资源目录
设置static中间件后，浏览器访问时，会自动去public目录寻找是否有匹配的静态资源（可以理解为浏览器自动把public目录拼接到服务器地址的后面，我们想要静态资源的时候，不用自己加目录（public），直接服务器网址后面加上资源名字就可以了）
在这里插入图片描述
如上图，地址栏中是http://localhost:3000/沈星回.png
而不是http://localhost:3000/public/沈星回.png(意思是public目录不用写)

设置静态资源代码示例

const express = require("express")
const path = require("path")

// 创建服务器的实例
const app = express()


// 设置static中间件后，浏览器访问时，会自动去public目录寻找是否有匹配的静态资源，默认寻找的是index.html文件
app.use(express.static(path.resolve(__dirname, "./public")))

// 配置路由
app.get("/loginaa", (req, res) => {
// 获取到用户输入的用户名和密码
// req.query 表示查询字符串中的请求参数
// console.log(req.query.username)
// console.log(req.query.password)
    if (req.query.username == "沈星回" && req.query.password == "5201314") {
        res.send("我知道了,沈星回是你老公！！！")
    }
    else {
        res.send("回答错误，你不是沈夫人")
    }

})


// 启动服务器
app.listen(3000, () => {
    console.log("服务器已起动~")
})