node.js-静态资源目录搭建
2021/11/4 22:16:09
本文主要是介绍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>
这篇关于node.js-静态资源目录搭建的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-16Vue3资料:新手入门必读教程
- 2024-11-16Vue3资料:新手入门全面指南
- 2024-11-16Vue资料:新手入门完全指南
- 2024-11-16Vue项目实战:新手入门指南
- 2024-11-16React Hooks之useEffect案例详解
- 2024-11-16useRef案例详解:React中的useRef使用教程
- 2024-11-16React Hooks之useState案例详解
- 2024-11-16Vue入门指南:从零开始搭建第一个Vue项目
- 2024-11-16Vue3学习:新手入门教程与实践指南
- 2024-11-16Vue3学习:从入门到初级实战教程