用 Node.js 搭建本地服務器

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

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

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

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

我們需要一個 HTTP 服務器

對于不同的請求，根據(jù)請求的 URL，我們的服務器需要給予不同的響應，因此我們需要一個路由，用于把請求對應到請求處理程序（request handler）

當請求被服務器接收并通過路由傳遞之后，需要可以對其進行處理，因此我們需要最終的請求處理程序

我們需要從 HTML 文件里提取數(shù)據(jù)以及展示服務器傳入的數(shù)據(jù)，因此需要將 HTML 和服務器結(jié)合起來

index.js

引用模塊

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

路由

/**
* 路由
* @param {Function} handle 請求處理程序
* @param {String} pathname 路徑
* @param {Object} response 響應數(shù)據(jù)
* @param {Object} postData 請求參數(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();
  }
}

服務器

/**
* 服務器
* @param {Function} route 路由
* @param {Function} handle 請求處理程序
*/
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");
}

請求處理程序

// 請求處理程序
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();
  }
};

啟動服務器

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

index.html

Document

關于 GET 和 POST 方式的請求參數(shù)

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

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

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

關于服務器響應頭中的 Content-Type

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

關于 Node.js 熱部署

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

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

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

supervisor 就是一個 Node.js 的開源熱部署工具：

npm i supervisor -g
supervisor server.js

該網(wǎng)友還提到另一個開源熱部署工具 hotcode，但經(jīng)測試 hotcode 若使用 express 4.x 則會報錯，因為 hotcode 使用的 express.createServer() 已經(jīng)被廢棄。

參考：
學習筆記：用Nodejs搭建一個簡單的本地服務器
NodeJS”熱部署“代碼，實現(xiàn)動態(tài)調(diào)試(hotnode，可以實現(xiàn)熱更新)

云服務器 GPU云服務器 webrtc node.js服務搭建搭建 node.js 云服務器搭建 node.js 云主機搭建 node.js 云vps

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/94445.html

Node.js 搭建本地HTTP服務器并應用node-http-proxy解決ajax跨域問題

摘要：搭建本地服務器參考了的搭建本地服務器做轉(zhuǎn)發(fā)使用實現(xiàn)，官方文檔配置服務器和轉(zhuǎn)發(fā)接口地址判斷如果是接口訪問，則通過轉(zhuǎn)發(fā)這里參考的源碼，補充了幾個字體文件的。起因：公司的產(chǎn)品更換前端框架，接口的訪問原本是通過nginx配置反向代理實現(xiàn)的，本地沒有安裝nginx，就用node.js做一個。 node.js搭建本地http服務器參考了shawn.xie的《nodejs搭建本地http服務器》...

binaryTree 2019-08-19 18:17 評論0 收藏0
如何在服務器上搭建hexo博客

原文鏈接隨著Vateral主題的開發(fā)接近了尾聲，在對主題速度優(yōu)化的時候發(fā)現(xiàn)之前用的githubpage問題多多：首先就是因為在國內(nèi)的原因，訪問速度本身就很慢，曾經(jīng)有次加載一張16kb的圖標時間耗費了26s?。?？其次，在對資源做CDN托管加速時，域名是需要備案的，顯然githubpage也是做不了的；所以果斷舍棄了這個把hexo搭建到了我的阿里云服務器上總體來說還是比把hexo搭建到github...

MycLambert 2019-08-01 16:49 評論0 收藏0
【實戰(zhàn)】用 express+MongoDB 搭建一個完整的前端項目

摘要：前言要做一個全沾的工程師，對于后端和數(shù)據(jù)庫來說，即使不認識也要見個面的?；玖私獾母拍罹秃?，主要是安裝上數(shù)據(jù)庫，并進行簡單的增刪操作。前言：要做一個全沾的工程師，對于后端和數(shù)據(jù)庫來說，即使不認識也要見個面的。本文給的例子很簡單，也貼出來源碼，只要一步步下來，就可以跑起來啦~~~ 思考一個需求：做一個登錄頁面，自己搭建服務和數(shù)據(jù)庫，將用戶輸入的登錄信息保存到數(shù)據(jù)庫如何完成呢：首先選擇...

Steve_Wang_ 2019-06-26 17:45 評論0 收藏0
webpack從零開始搭建多頁面（一）:webpack起步到運行一個簡單的demo

摘要：文件夾用來存放供瀏覽器讀取的文件，這個是打包成的文件。在文件下手動建立一個文件，并寫入下面的代碼。配置出口文件的地址在版本后，支持多出口配置?？梢苑乐共煌僮飨到y(tǒng)之間的文件路徑問題，并且可以使用相對路徑按照預期工作。搭建webpack_demo1項目，使其運行起來 webpack的強大就不介紹了，我們直接動手做起來，我們從零開始一步步搭建一個多頁面的系統(tǒng)，多參考webpack中文文檔...

EsgynChina 2019-08-26 11:39 評論0 收藏0
nodejs搭建本地http服務器

摘要：然后找了個例子，都成功實現(xiàn)了，一個是自已寫代碼，要處理好多問題，比如我的網(wǎng)頁是，是搞了半天裝了個庫安裝編碼轉(zhuǎn)換結(jié)果可以運行了，中文路徑的問題也搞定了，但是圖片問題還沒搞定，也變成了文字讀取。初學NODEJS，從網(wǎng)站下載了一個單文件的node.exe，簡單JS測試可以了，但是需要用到一些庫就完全不行了什么npm命令，輸了都無效，想安裝npm也不知咋弄后面下載了最新版本，安裝的msi版本...

fxp 2019-08-20 17:32 評論0 收藏0