Javascript

node.js-静态资源目录搭建

本文主要是介绍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-静态资源目录搭建的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航