[Node-RED] 建立Hello World網頁

學習新的技術,第一步都要會的 Hello World 。

  1. 在 Node-RED 設計畫面的左邊節點清單中找到「網絡」下的「http in」,將他拖曳到流程畫面中,如下圖:
    建立HelloWorld01
  2. 設定該節點屬性,步驟1:在「http in」這個節點,將滑鼠左鍵點擊二下出現該節點的屬性內容;步驟2:「請求方式」選擇「GET」;步驟3:「URL」輸入「/hello」;步驟4:點選「完成」。
    建立HelloWorld02
  3. 接來,在左邊節點清單中找到「功能」下的「template」,將他拖曳到流程畫面中,如下圖:
    建立HelloWorld03
  4. 設定該節點屬性,步驟1:在「模板」這個節點,將滑鼠左鍵點擊二下出現該節點的屬性內容;步驟2:「名稱」輸入「hello」;步驟3:「語法高亮」選擇「HTML」;
    步驟4:「模板」輸入以下內容(此為html語法)
    <!DOCTYPE html>
    <html>
    <head>
    <title>Hello World</title>
    </head>
    <body>
    Hello World!!!
    </body>
    </html>
    步驟5:點選「完成」。
    建立HelloWorld04
  5. 接著,在左邊節點清單中找到「網路」下的「http response」,將他拖曳到流程畫面中,如下圖:
    建立HelloWorld05
  6. 接著,以拖拉的方式(在前一個節點最右端的圓圈處,按著滑鼠左鍵不放,拖拉到下一個節點最左端的圓圈處,再放掉滑鼠左鍵),依序將每個節點連結起來。
    建立HelloWorld06
  7. 最後,部署該流程,點擊視窗右上角的「部署」按鈕,即可完成部署。
    建立HelloWorld07
  8. 開啟瀏覽器,在網址列輸入:「http://127.0.0.1:1880/hello」,即可在瀏覽器看到 Hello World!!!
    建立HelloWorld08

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *