iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 8
0
Modern Web

Node-Red 貓的真實之口系列 第 8

Node-Red 貓的真實之口-以 Node-RED 作為靜態資源服務器 - 1/2

嗨各位讀者,最近好嗎?
今天讓筆者來分享一下天罰貓網頁的後台技術。

在 Node-RED 上建立 Web Server

後台最基本的需求,當然是「靜態資源伺服器」。

在基於 NodeJS 的 Node-RED 上開發一個 HTTP web 伺服器,是再自然不過的應用了。作法就是從內建的 http node 出發,根據需求,將資料一路向右接到 http response node。

例如,你可以在其中串接 file node,Node-RED 就變成了靜態資源服務器(static file server)。一條 flow 代表著一個請求路徑,會對應回應的檔案。

聰明的服務器:根據路徑回應靜態資源

進階一點,你可能會想要靜態資源服務器更聰明,能夠根據請求路徑,動態的回應某個資料夾上的檔案。但你又不想要建立太多條 http node 到 http response node 的 flow。

這時,第三方套件 node-red-contrib-uibuilder (以下簡稱 uibuilder) 可以幫助你實現這個功能。

uibuilder 簡介

uibuilder 提供了一個 node 讓你可以靠它實現一個根據路徑的靜態資源服務器。它預設的靜態資源路徑是 ~/.node-red/uibuilder/uibuilder。也就是說你可以將所有 Web 專案資源放在這裏,你就可以用 Node-RED 建立一個單頁式網頁應用(Single Page Application)。如果想要客製化其他路徑,可以在 uibuilder node 的 URL 欄位設定。

uibuilder-flow

連接網址 localhost:1880/uibuilder 可以看到歡迎畫面

demo-uibuilder

而天罰貓網頁應用也是個 SPA,筆者會將打包好的 React 專案資源放在預設路徑 ~/.node-red/uibuilder/uibuilder

我們已經看完了天罰貓網頁端應用後台的第一部分(靜態資源回應)。接下來我們會來看看天罰貓後台的其他功能。


上一篇
Node-Red 貓的真實之口-基礎Node-1
下一篇
Node-Red 貓的真實之口-以 Node-RED 作為靜態資源服務器 - 2/2
系列文
Node-Red 貓的真實之口13

尚未有邦友留言

立即登入留言