用 Node.js 搭建本地服務(wù)器

Crazy_Coder 發(fā)布于2019-08-22 16:33 / 3414人閱讀

摘要：服務(wù)器端在響應(yīng)兩種請(qǐng)求方式時(shí)，響應(yīng)數(shù)據(jù)格式參考官方文檔。關(guān)于熱部署啟動(dòng)服務(wù)器時(shí)是將腳本放入內(nèi)存，以后都會(huì)直接訪問(wèn)內(nèi)存，避免重復(fù)載入。參考學(xué)習(xí)筆記用搭建一個(gè)簡(jiǎn)單的本地服務(wù)器熱部署代碼，實(shí)現(xiàn)動(dòng)態(tài)調(diào)試，可以實(shí)現(xiàn)熱更新

原文：https://zhictory.github.io/bl...

網(wǎng)友 bottle_ 提供搭建一個(gè)簡(jiǎn)單本地服務(wù)器的思路為下：

我們需要一個(gè) HTTP 服務(wù)器
對(duì)于不同的請(qǐng)求，根據(jù)請(qǐng)求的 URL，我們的服務(wù)器需要給予不同的響應(yīng)，因此我們需要一個(gè)路由，用于把請(qǐng)求對(duì)應(yīng)到請(qǐng)求處理程序（request handler）
當(dāng)請(qǐng)求被服務(wù)器接收并通過(guò)路由傳遞之后，需要可以對(duì)其進(jìn)行處理，因此我們需要最終的請(qǐng)求處理程序
我們需要從 HTML 文件里提取數(shù)據(jù)以及展示服務(wù)器傳入的數(shù)據(jù)，因此需要將 HTML 和服務(wù)器結(jié)合起來(lái)

index.js

引用模塊

const fs = require("fs"); // 系統(tǒng)文件及目錄進(jìn)行讀寫(xiě)操作
const http = require("http"); // 封裝了高效的 HTTP 服務(wù)器和 HTTP 客戶端
const url = require("url"); // URL 處理

路由

/**
* 路由
* @param {Function} handle 請(qǐng)求處理程序
* @param {String} pathname 路徑
* @param {Object} response 響應(yīng)數(shù)據(jù)
* @param {Object} postData 請(qǐng)求參數(shù)
*/
function route(handle, pathname, response, postData) {
  if (typeof handle[pathname] === "function") {
    handle[pathname](response, postData);
  } else {
    response.writeHead(404, { "Content-Type": "text/plain" });
    response.write("404 Not Found");
    response.end();
  }
}

服務(wù)器

/**
* 服務(wù)器
* @param {Function} route 路由
* @param {Function} handle 請(qǐng)求處理程序
*/
function start(route, handle) {
  function onRequest(request, response) {
    const pathname = url.parse(request.url).pathname;
    let postData = "";
    switch (request.method) {
      case "GET":
        postData += url.parse(request.url).query;
        request.setEncoding("utf8");
        route(handle, pathname, response, postData);
        break;
      case "POST":
        request.addListener("data", function (postDateChunk) {
          postData += postDateChunk;
        });
        request.addListener("end", function () {
          route(handle, pathname, response, postData);
        });
        break;
    };
  }

  http.createServer(onRequest).listen(8080);
  console.log("Server has started");
}

請(qǐng)求處理程序

// 請(qǐng)求處理程序
const handle = {
  // index 接口
  "/public/index.html": function (response, postData) {
    const pathname = __dirname + "/public/index.html";
    fs.readFile(pathname, function (err, data) {
      response.end(data);
    });
  },
  // download 接口
  "/download": function (response, postData) {
    response.writeHead(200, { "Content-Type": "text/html" });
    response.write(JSON.stringify({
      code: 200,
      data: {
        "time": new Date().toLocaleString("en-US")
      }
    }));
    response.end();
  },
  // upload 接口
  "/upload": function (response, postData) {
    response.writeHead(200, { "Content-Type": "text/html" });
    response.write("You have sent: " + JSON.parse(postData).value);
    response.end();
  }
};

啟動(dòng)服務(wù)器

// 啟動(dòng)服務(wù)器 = 路由處理 + 接口處理
start(route, handle);

index.html

Document

關(guān)于 GET 和 POST 方式的請(qǐng)求參數(shù)

GET 的請(qǐng)求參數(shù)是以查詢參數(shù)形式放在 URL 后面的，服務(wù)器可以從 URL 上獲取參數(shù)：url.parse(request.url).query。

POST 的請(qǐng)求參數(shù)則需要作為 xhr.send() 的參數(shù)并轉(zhuǎn)換為字符串來(lái)傳遞，本文使用 JSON.stringify() 來(lái)轉(zhuǎn)換，再在服務(wù)器端用 JSON.parse() 轉(zhuǎn)換。

服務(wù)器端在響應(yīng)兩種請(qǐng)求方式時(shí)，響應(yīng)數(shù)據(jù)格式參考官方文檔。

關(guān)于服務(wù)器響應(yīng)頭中的 Content-Type

一般網(wǎng)站的做法是：當(dāng)返回 HTML 頁(yè)面時(shí)為 text/html，當(dāng)使用 JSONP 時(shí)為 text/javascript，當(dāng)使用 CORS 時(shí)為 application/json。

關(guān)于 Node.js 熱部署

Node.js 啟動(dòng)服務(wù)器時(shí)是將腳本放入內(nèi)存，以后都會(huì)直接訪問(wèn)內(nèi)存，避免重復(fù)載入。這種設(shè)計(jì)雖然有利于提高性能，卻不利于開(kāi)發(fā)調(diào)試，導(dǎo)致修改 Node.js 代碼后需要手動(dòng)終止進(jìn)程并重啟才會(huì)生效。

網(wǎng)友會(huì)奔跑的胖子提出方案：

你只需要在修改文件后保存，它就能自動(dòng)替你發(fā)布，這就是所謂的熱部署。

supervisor 就是一個(gè) Node.js 的開(kāi)源熱部署工具：

npm i supervisor -g
supervisor server.js

該網(wǎng)友還提到另一個(gè)開(kāi)源熱部署工具 hotcode，但經(jīng)測(cè)試 hotcode 若使用 express 4.x 則會(huì)報(bào)錯(cuò)，因?yàn)?hotcode 使用的 express.createServer() 已經(jīng)被廢棄。

參考：
學(xué)習(xí)筆記：用Nodejs搭建一個(gè)簡(jiǎn)單的本地服務(wù)器
NodeJS”熱部署“代碼，實(shí)現(xiàn)動(dòng)態(tài)調(diào)試(hotnode，可以實(shí)現(xiàn)熱更新)