極簡易node伺服器

慕逸發表於2018-01-25

緣由

  1. 在開發vue的過程中,npm run build後生成的檔案需要在服務端才可以使用
  2. 本地使用引入less.min.js檔案來進行除錯時,也依賴伺服器環境,不要吐槽為什麼不用less-loader......
  3. 只需要放置一個靜態頁面的簡單伺服器。
  4. etc.

以往使用的是類似基於appche的xammp工具,但xammp有些笨重(200M+),於是選擇用nodejs來實現一個簡單的服務,來放置頁面。

現狀

nodejs本身已經提供了建立服務的方法createServer,但沒有提供頁面入口,express,koa等框架提供了,但略複雜。

使用方法

因此,寫了一個簡單的無依賴的服務,用來預覽頁面。使用方法如下:

git clone https://github.com/sumnow/simple-server.git
node server.js
複製程式碼

開啟瀏覽器http://localhost:8080 即可檢視效果。

預設服務啟動在8080埠,預覽目錄下的index.html,可以修改server.js來改變埠和頁面地址。

var port = 8080;
var pagePath = "/index.html"
複製程式碼

原理分析

原理就是Browser向Server請求頁面的時候,其實是一個GET請求,不過是按照不同的Content-Type來解析

    "css": "text/css",
    "gif": "image/gif",
    "html": "text/html",
    "ico": "image/x-icon",
    "jpeg": "image/jpeg",
    "jpg": "image/jpeg",
    "js": "text/javascript",
    "json": "application/json",
    "pdf": "application/pdf",
    "png": "image/png",
    "svg": "image/svg+xml",
    "swf": "application/x-shockwave-flash",
    "tiff": "image/tiff",
    "txt": "text/plain",
    "wav": "audio/x-wav",
    "wma": "audio/x-ms-wma",
    "wmv": "video/x-ms-wmv",
    "xml": "text/xml"
複製程式碼

例如以上的常見檔案格式以及type,按照type返回給Browser就可以正常解析啦。

使用體驗

目前基於這個建立的自用FileServer執行良好~

專案地址: github.com/sumnow/simp…

相關文章