1. 程式人生 > >使用Node.js的http-serve搭建本地伺服器

使用Node.js的http-serve搭建本地伺服器

為什麼要使用它?

  首先,類似於vue-cli建立的專案,都能夠實現瀏覽器中自動重新整理,實時檢視專案效果。其中的原理在於,webpack這樣的工具啟動了一個本地伺服器,將本機當作一臺伺服器,這樣在瀏覽器中輸入特定url(如http:localhost...)便相當於訪問一臺伺服器的檔案,這裡的伺服器比較特殊就是本機。   試想,如果我們的前端專案中,不採用這種方式,要檢視一個html檔案的執行效果,需要怎麼操作呢?我們很容易想到,直接用瀏覽器開啟html檔案就能夠檢視到效果,每檢視一個html檔案就需要去雙擊該檔案。另外一種方式是,我們只需啟動一個本地伺服器,輸入特定url,就能夠訪問特定目錄的所有檔案,很容易直接觀察檔案在瀏覽器中的執行效果。顯然,後者不需要在瀏覽器和資源管理器間切換,顯得更為方便。   這說明,如果我們需要測試伺服器與客戶端的互動,啟動本地作為一個伺服器是相當方便而有必要的。   另外一個理由:假使需要在某電腦X上訪問本機檔案,便可以啟動本機作為一個伺服器,就像訪問其他任何網站一樣,在電腦X的瀏覽器上輸入特定url

,就可以訪問本機特定位置的檔案。

安裝和啟動

  假設你的電腦已經安裝了Node.jsnpm,那麼啟動http-serve服務是相當簡單的。   首先,使用npm安裝http-server

npm install -g http-server

  然後,進入你想作為本地伺服器根目錄的位置,輸入如下命令:   

http-server

當然,後面還可以跟一系列引數,這可以通過查閱相關文件進行配置,此處略。

訪問本地伺服器

   啟動本地伺服器成功後,將在命令列中看到類似以下的提示:

Starting up http-server, serving ./
Available on
:
http://127.0.0.1:8080 http://10.8.74.44:8080 Hit CTRL-C to stop the server

  其含義是:正在執行一個將當前目錄作為根目錄的伺服器,可以通過以下方式訪問這臺伺服器:

http://127.0.0.1:8080(本機瀏覽器訪問)
http://10.8.74.44:8080(同一個網路的其他電腦訪問)

  可以通過ctrl+C使伺服器停止執行。