node.js-静态资源目录搭建
/* * @Description: 静态资源目录搭建-index.js * @Version: 1.0 * @Autor: Nanke_南柯 * @Date: 2021-11-04 14:26:33 * @LastEditors: Nanke_南柯 * @LastEditTime: 2021-11-04 19:23:10 */ const path = require('path')//可以直接读取到物理路劲 const readStaticFile = require('./readStaticFile') require("http").createServer(async (req, res) => { const urlStr = req.url; console.log('urlStr', urlStr); let filePathName = path.join(__dirname, '/public', urlStr) console.log('filePathName', filePathName); let { mimeType, data } = await readStaticFile(filePathName) console.log(data); res.end() }).listen(5080, () => { console.log("localhost:5080 Listen..."); })
/* * @Description: 静态资源目录搭建-readStaticFile.js * @Version: 1.0 * @Autor: Nanke_南柯 * @Date: 2021-11-04 14:40:28 * @LastEditors: Nanke_南柯 * @LastEditTime: 2021-11-04 19:23:20 */ const path = require("path") const mime = require("mime"); const fs = require("fs"); // 遇到一个致命问题,只要existsSync去检查文件或文件夹是否存在 查找路径与当前运行环境路径相同的话就一直false找不到 去读取其他盘符的文件就读到了 //求大神解 fs.access也试过了 百度一天我放弃了 浪费我一天时间了 console.log('asdasdasd',fs.existsSync("C:\Users\NanKe\Desktop\nodejs\15-static\public\images")); function myReadFile(file) { return new Promise((resolve, reject) => { fs.readFile(file, (err, data) => { if (err) { reject('你访问的是一个文件夹,且文件夹里没有index.html') } else { resolve(data) } }) }) } async function readStaticFile(filePathName) { console.log('aaaaaaaaaa',filePathName); //filePathName=传递过来的物理路径 //path.parse解析对象拿到dir base ext name等 console.log('filePathName', path.parse(filePathName)); let ext = path.parse(filePathName).ext //拿到文件类型ext console.log('ext', ext); let mimeType = mime.getType(ext) //传递文件类型给mime插件 让mime自动识别和返回后端设置响应头动态设置 console.log('mimeType', mimeType); let data //判断前端请求资源 服务端文件是否存在 if (fs.existsSync(filePathName)) { if (ext) { data = await myReadFile(filePathName) } else { //文件不存在时 回首页 data = await myReadFile(path.join(filePathName, '/index.html')) } } else { data = 'file or folder not found.' } return { data, mimeType } } module.exports = readStaticFile
目录结构
<!-- * @Description: index.html * @Version: 1.0 * @Autor: Nanke_南柯 * @Date: 2021-11-04 14:29:28 * @LastEditors: Nanke_南柯 * @LastEditTime: 2021-11-04 19:24:35 --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>static</title> <link rel="stylesheet" href="./styles/reset.css"> <script src="./scripts/common.js"></script> </head> <body> hello Nanke_南柯 <img src="./images/img1.jpg" alt=""> </body> </html>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
2020-11-04 Vue路由守卫和拦截器
2020-11-04 Vue @click.native和@click.stop和@click.self