node实现简单的apache服务

一,首先我先在指定的路径下创建文件,方便通过服务器查到文件
在这里插入图片描述
二,node 文件

const http  = require("http");
const fs = require("fs");
const path = require("path");
const  config = require("./config");

//拿到跟目录
const documentRoot = config.documentRoor;
const server = http.createServer();
server.on("request",(req,res)=>{
    //路径 
    let url = req.url;
    //拿到跟目录路径
    let tmp = documentRoot + url;
    //检查跟目录路径是否存在 存在放回true,不存在返回false
    let exitst = fs.existsSync(tmp);
    //一层判断判断跟目录路径和路径是否符合标准
    if(exitst || url == "/favicon.ico" || url == "/"){
        //同步接收tmp的路径
        let stats1 = fs.statSync(tmp);
        //二层判断判断当前路径是否是文件夹
        if(stats1.isDirectory()){
            //三层判断,判断没有开目录浏览权限
            if(!config.directoryBrowse){
                res.end("403 not file");
                return;
            }
        
        //遍历目录,读取文件
        fs.readFile("./template.html" , (err,data) =>{
            //判断,如果访问err,return 404
            if(err){
                return res.end("404 not find")
            }
            //声明进入的页面的display的显示
            let prveDisplay = "block";
            //判断路径如果为/,为主显示页面,title隐藏
            if(url == "/"){
                prveDisplay =  "none";
            }
            //读取tmp的文件目录
            fs.readdir(tmp,(err,files)=>{
                //失败return
                if(err){
                    return res.end("can not find dir")
                }
                //声明一个字符串,收集遍历字符串模板 
                let content = "";
                //将成功的文件目录进行遍历
                files.forEach((item) =>{
                    //声明样式
                    let type = "";
                    //声明文件后缀的一个/
                    let separate = "";
                    //同步接收tmp的路径加上tmp的文件目录下的文件路径
                    let stats2 = fs.statSync(tmp + item)
                    //判断stats2路径下是否有文件
                    if(stats2.isDirectory()){
                       //成功加上样式
                        type = "dir";
                       separate = "/";  
                    }else{
                        type = "file"
                    }
                    //http://127.0.0.1:端口号 路径 文件目录的文件 /
                    content += `
                    <tr>
                       <td>
                           <a class="icon ${type}" href="http://127.0.0.1:${config.port + url + item + separate}">${item + separate}</a>
                       </td>
                    </tr>

                    `
                })

                //替换
                //将成功下的文件转为字符串
                data = data.toString();
                //将html界面下的文本替换成字符串模板的文本
                data = data.replace("tihuan" , content);
                //替换页面样式
                data = data.replace(/{{path}}/g , url.substring(1))
                data = data.replace('{{display}}' , `style="display: ${prveDisplay};"`);
                data = data.replace(/{{parentPath}}/g , url.substring(0,url.substr(0,url.length-1).lastIndexOf('/')+1))
                //res结束,data
                res.end(data)
            })
        })
    //判断跟目录路径和路径不符合标准
    }else{
        //渲染文件 读取文件
        fs.readFile(tmp , (err , data)=>{
            //err 直接res.end
            if(err){
                res.end();
            }
            //声明ext 接收文件扩展名去掉点
            let ext = path.extname(tmp).substring(1);
            //文件类型的判断
            if(ext in config.mineType.text){
                //请求头判断
                res.setHeader("Content-type" , `${config.mineType.text[ext]};charset=${config.charset}`)
            }else if(ext in config.mineType.image){
                //请求头判断
                res.setHeader("Content-type" , `${config.mineType.image[ext]}`)
            }else{
                //请求头判断
                res.setHeader("Content-type" , `${config.mineType.other};charset=${config.charset}`)
            }
            //res.end
            res.end(data)
        })
    }
   }else {
       //res.end
       res.end();
   }
})
//静态服务器端口号
server.listen(config.port);

通过找到文件的路径打开cmd 输入 node 文件名 启动服务
在这里插入图片描述
启动服务后,通过输入localhost: 端口号
在这里插入图片描述

就可以查到对于的文件了,这样一个apache服务就完成了

最后介绍下通过cmd快速创建文件
首先创建好用一个文件夹,通过shift + 鼠标右键,打开cmd界面
然后通过输入npm init 创建初始化文件
在这里插入图片描述
然后按照下面的步骤进行执行
在这里插入图片描述
然后输入 npm i 创建记录文件
在这里插入图片描述
创好后可以可以引入插件文件,比如引入jquery
在这里插入图片描述
引入好后显示的页面就是这样的
在这里插入图片描述
同时引入jquery,在记录文件里面也有记录
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值