关于server.js启动html时出现的css样式和图片加载问题

明明单独启动

查看server.js代码

javascript 复制代码
app.use(express.static('public'));

发现这样一句话

app.use(express.static('public'))这行代码的作用是指定public目录为静态资源目录,这样客户端就可以直接访问这个目录下的文件了

但是有个非常重要的问题 此时要注意你的路径 当你把css样式或图片放入这个public路径时

不应该是

html 复制代码
    <link rel="stylesheet" href="./public/style.css">
html 复制代码
    <img src="./public/img/school_logo.png" alt="school logo">

而应该是

html 复制代码
    <link rel="stylesheet" href="style.css">
html 复制代码
    <img src="./img/school_logo.png" alt="school logo">

这是因为当用户请求http://端口/images/logo.png时,服务器会自动从public/images/logo.png文件中读取内容并返回给用户,而不需要你编写任何额外的路由处理逻辑

相关推荐
心.c20 小时前
CommonJS和ES Module
javascript·后端·node.js
步十人20 小时前
【JWT】验证令牌的使用
前端·bootstrap·html
吃好睡好便好20 小时前
用if…elseif…end语句输出成绩等级
开发语言·前端·javascript·数据库·学习·matlab·信息可视化
弹简特20 小时前
【Vue3速成】03-vue基本语法的使用
前端·javascript·vue.js
humcomm20 小时前
FinClip vs React Native:两大跨平台方案的深度对比
javascript·react native·react.js
放下华子我只抽RuiKe520 小时前
FastAPI 全栈后端(一):为什么选择 FastAPI
前端·javascript·深度学习·react.js·机器学习·前端框架·fastapi
ZC跨境爬虫20 小时前
跟着 MDN 学CSS day_11:(深入理解CSS值与单位的完整体系)
前端·css·ui·html·tensorflow
A南方故人20 小时前
将容器内的元素变为可拖拽
开发语言·javascript·ecmascript