Nodejs入門基礎（fs、path模組）
阿新 • • 發佈：2018-12-11
案例：載入靜態資訊（如圖片，網頁等），post提交方式獲取資料，path擷取字尾名
預設介面 index.html：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h2>歡迎來到課工場</h2> <a href="./login.html">登入</a> <a href="./zhuce.html">註冊</a> </body> </html>
登入介面login.html：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>登入</title> </head> <body> <!--post提交方式--> <h2>登入</h2> <form action="http//localhost:3000/login" method="post"> 使用者名稱：<input type="text" name="name"/><br> 密碼：<input type="password" name="pass"/><br> <input type="submit" value="提交"> <input type="reset" value="重置"> </form> </body> </html>
註冊介面zhuce.html：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>註冊</title> </head> <body> <form action="http//localhost:3000/zhuce" method="post"> 註冊的使用者名稱：<input type="text" name="name"/><br> 註冊的密碼：<input type="password" name="pass"/><br> <input type="submit" value="提交"> <input type="reset" value="重置"> </form> </body> </html>
錯誤提示頁面404.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>報錯哦！沒有找到該頁面</h1>
<form action="http://localhost:3000" enctype="multipart/form-data" >
上傳圖片：<input type="file"/>
<input type="submit" value="提交"/>
</form>
</body>
</html>
work1.js:
var fs = require("fs");
var http = require("http");
var url = require("url");
var path = require("path");
http.createServer(function (req, res) {
res.writeHead(200, {"Content-type": "text/plain;charset=UTF-8", "Access-Control-Allow-Origin": "*"});//瀏覽器相容問題
if (req.url == "/favicon.ico") {
return;
}
var pathname = url.parse(req.url).pathname;
/* console.log(pathname);*/
if (pathname == "/") {//設定預設頁面
pathname = "/index.html";
}
//載入靜態資訊
fs.readFile("./static" + pathname,
function (err, data) {
if (err) {//錯誤方法
console.log("錯誤");
fs.readFile("./static/404.html", function (err, data) {
if (err) {//錯誤呀頁面沒有找到
console.log("404都沒有");
} else {//給於錯誤提示
res.writeHead(404, {"Content-type": "text/html;charset=UTF-8"});
res.end(data);
}
})
} else {//正確方法
console.log("正確");
var extname = path.extname(pathname);//擷取字尾名
console.log(extname);
var mine = getMine(extname);//根據字尾名進行編輯
res.writeHead(200, {"Content-type": mine});//不同檔名編碼不一樣
res.end(data);
}
});
//判斷來自哪一個頁面，並且獲取使用者post形式輸入的資訊
var dz = url.parse(req.url, true);
console.log(dz);
if (req.method.toLowerCase() == "post"&&dz.pathname == "/http//localhost:3000/login") {
console.log("來自登入的頁面");
console.log("進入post驗證");
var allData = "";
req.on("data", function (chunk) {
allData += chunk;
});
req.on("end", function () {
var dataString = allData.toString();
res.write("使用者登入的資訊如下:");
res.end(dataString);
});
}
if (req.method.toLowerCase() == "post"&&dz.pathname == "/http//localhost:3000/zhuce") {
console.log("來自注冊的頁面");
console.log("進入post驗證");
var allData = "";
req.on("data", function (chunk) {
allData += chunk;
});
req.on("end", function () {
var dataString = allData.toString();
res.write("使用者註冊的資訊如下：");
res.end(dataString);
});
}
}).listen(3000, "localhost");
function getMine(extname) {
switch (extname) {
case '.html':
return "text/html;charset=UTF-8";
case ".css":
return "text/css";
case ".jpg":
return "image/jpg";
break;
}
}