关于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文件中读取内容并返回给用户,而不需要你编写任何额外的路由处理逻辑

相关推荐
weedsfly2 小时前
异步编程全景与事件循环——彻底搞懂 JS 执行机制
前端·javascript
用户059540174462 小时前
AI Agent记忆测试踩坑实录:Mock骗了我一周,Mem0+pytest一招破局
前端·css
用户1733598075372 小时前
纯前端 PDF 数字签名实战:Vue 3 + pdf-lib 在浏览器里完成签名嵌入
前端·javascript
JieE21213 小时前
LeetCode 226. 翻转二叉树|JS 递归超详细拆解,二叉树入门经典题
javascript·算法
JieE21213 小时前
LeetCode 104. 二叉树的最大深度|递归思路超详细拆解
javascript·算法
kyriewen17 小时前
我用 AI 一周写完了整个项目,上线第一天就崩了——这是我踩过最贵的 5 个坑
前端·javascript·ai编程
Larcher17 小时前
AI Loop:让AI像人一样自主完成任务的核心机制
javascript·人工智能·设计模式
默_笙18 小时前
🃏 JS 只有 8 种数据类型,但我花了 2 天才搞懂 null 和 undefined 的区别
javascript
jump_jump18 小时前
流式 HTML:从 htmx 片段装配到浏览器原生增量渲染
javascript·性能优化·前端工程化
swipe20 小时前
正则表达式入门到进阶:从表单校验到手写模板引擎
前端·javascript·面试