node模擬apache的工作目錄
源碼
源碼后臺(tái)JS源碼
var http = require('http');
var fs = require('fs');
var template = require('art-template');
var server = http.createServer(function(rsp, res) {
var url = rsp.url;
if(url == '/favicon.ico') return;
url = url.substr(1) ? url.substr(1) : 'index.html';
if(url === 'index.html') {
fs.readFile('./../' + url, function(err, data) {
if(err) throw err;
var render = template.compile(data.toString());
fs.readdir('./../', function(err, data) {
res.end(render({ files: data }))
})
});
} else {
fs.readFile('./../index.html', function(err, data) {
if(err) throw err;
var render = template.compile(data.toString());
fs.readdir('./../' + url, function(err, data) {
//處理readdir只能讀取文件夾，用戶查詢到目錄最后訪問(wèn)文件的操作
if(err) {
//訪問(wèn)的不是文件夾訪則開(kāi)始讀取文件內(nèi)容
fs.readFile('./../' + url, function(err, data) {
if(err) throw err;
res.end(data);
})
} else {
//處理多級(jí)目錄的問(wèn)題解決辦法
url = url.split('/').length >= 2 ? url.split('/')[url.split('/').length - 1] : url;
res.end(render({ files: data, urlData: url + '/' }));
}
})
});
}
});
server.listen(3000, function() {
console.log('running.....')
})
模板源碼（html）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<ul>
{{each files}}
<li><a href="{{urlData}}{{ $value}}">{{ $value}}</a></li>
{{/each}}
</ul>
</body>
</html>
使用說(shuō)明：（詳情請(qǐng)看圖）
首先利用npm下載第三方的模板引擎： npm i art-template;
在你的工作目錄下添加app文件夾并引入后臺(tái)的app.js代碼
在工作目錄環(huán)境下引入模板index.html
image.png
寫(xiě)程序過(guò)程中遇到的問(wèn)題與用到的node技術(shù)：
- [x] 技術(shù)
- 采用了node兩個(gè)模塊途戒，http和fs模塊办桨，具體的API詳見(jiàn)官網(wǎng)：
- fs模塊的度文件readFile和讀文件夾readdir的API，和http的服務(wù)開(kāi)啟的API（此次程序綁定的端口為3000）
- [x] 問(wèn)題
- 利用訪問(wèn)的目錄來(lái)確定此次訪問(wèn)的文件內(nèi)容想际；就會(huì)出現(xiàn)路徑問(wèn)題，此處需采用的是相對(duì)路徑
- 文件的多級(jí)訪問(wèn)中溪厘，目錄中嵌套文件的處理胡本，處理上層目錄的url，利用a鏈接href來(lái)進(jìn)行操作
- fs模塊的readdir的API只能讀取文件夾讀取文件時(shí)會(huì)產(chǎn)生err錯(cuò)誤畸悬，利用這個(gè)特性可以判斷來(lái)讀取文件侧甫；
