js代码:
var http = require('http'); var fs = require('fs'); var template = require('art-template'); //1、创建server var server = http.createServer(); //2、监听Server的request请求事件,请求处理函数 // 请求 // 处理 // 响应 //一个请求对应一个响应,如果在一个请求的过程中,已经结束响应了,则不能重复发送响应 //没有请求就没有响应 //我们以前使用过 Apache 服务器软件,这个软件默认有一个 www 目录,所有存放在 www 目录中资源都可以通过网址来浏览 //127.0.0.1:3000/a.txt //127.0.0.1:3000/index.html //127.0.0.1:3000/apple/login.html var wwwDir = 'C:\\Users\\18236\\Desktop\\web前端学习\\www' server.on('request',function (req,res){ var url = req.url; fs.readFile('./template-apache.html',function (err,data){ if(err){ return res.end('404 not found'); }else{ //1、如何得到wwwDir的文件名和目录名 // fs.readdir fs.readdir(wwwDir,function (err,files){ if(err){ return res.end('Can not find www dir'); } //模板引擎解析替换data中的模板字符串就可以了 //数据就是files //然后去你的template.html文件中编写你的模板语法就可以了 var htmlStr = template.render(data.toString(),{ files:files }) console.log(files); //3、发送解析执行之后的html页面 res.end(htmlStr); }) } }) }) //3、绑定端口号,启动服务器 server.listen(3000,function (){ console.log('服务器启动了...'); })template-apache.html代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> table th,td{ width: 100px; text-align: center; } table th:nth-child(3),td:nth-child(3){ width: 200px; text-align: center; } </style> </head> <body> <h3>C:/User/18236</h3> <hr> <table> <thead> <tr> <th>名称</th> <th>大小</th> <th>修改日期</th> </tr> </thead> <tbody> {{each files}} <tr> <td><a href="">{{$value}}</a></td> <td></td> <td>2020/10/7 下午17:48:00</td> </tr> {{/each}} </tbody> </table> </body> </html>结果: