在此之前可以先下載nodemon套件,並且用 nodemon app.js
開啟應用程式,nodemon的好處在於如果應用程式有改變時可以立即改變畫面。
這篇記錄如何用原生的Node.js語法建立一個伺服器,分為不引入和引入html檔案的寫法:
const http = require('http');
const url = require('url');
// 建立伺服器處理請求並回應
const server = http.createServer((req, res) => {
if( req.url === "/" ) {
// 寫入HTML語法
res.writeHead(200, {"Content-Type": "text/html"});
res.write(`<h1>You are on the homepage</h1>`);
res.write(`'/' means the path is homepage`);
res.end();
} else {
cosnt parsedUrl = url.parse(req.url)
const user = parsedUrl.replace('/');
res.write(`Hello ${user}`);
res.end();
}
});
// 讓伺服器監聽來自port 8000的請求
server.listen(8000, () => {
console.log('Server is running on port 8000');
});
另外也有一種方式是直接引入外部的html檔案:
const http = require('http');
const path = require('path')
const fs = require('fs');
const server = http.createServer((req, res) => {
if(req.url === "/") {
// 讀取html檔案
fs.readFile(path.join(__dirname, "index.html"), (err, data) => {
res.writeHead(200, {"Content-Type": "text/html"});
res.write(data); // 寫入html檔案
res.end();
})
}
});
server.listen(8000, () => {
console.log('Server is running on port 8000');
});
不過一般都會用Express.js這個套件去建立伺服器,所以原生伺服器的建立方式只記錄到這裡。
References
2022網頁開發全攻略(HTML, CSS, JavaScript, React, SQL, Node, more)
http.createServer([options][, requestListener]) @Node.js v18.x