如何設定本地測試伺服器？

本文介紹如何在您的機器上設定簡單的本地測試伺服器，以及如何使用它的基本知識。

先決條件	您需要首先了解網際網路是如何工作的，以及什麼是 Web 伺服器。
目標	您將學習如何設定本地測試伺服器。

本地檔案與遠端檔案

在大多數學習區域中，我們建議您直接在瀏覽器中開啟示例 - 這可以透過雙擊 HTML 檔案、將其拖放到瀏覽器視窗或選擇檔案 > 開啟... 並導航到 HTML 檔案來完成。有很多方法可以實現這一點。

如果 Web 地址路徑以file://開頭，後面跟著本地硬碟上檔案的路徑，則使用本地檔案。相反，如果您檢視託管在 GitHub 上（或其他遠端伺服器上的示例）的示例，Web 地址將以http://或https://開頭，表示檔案已透過 HTTP 接收。

測試本地檔案的問題

如果您將某些示例作為本地檔案開啟，它們將無法執行。這是由於多種原因造成的，最有可能的原因是

它們包含非同步請求。一些瀏覽器（包括 Chrome）如果只是從本地檔案執行示例，將不會執行非同步請求（參見從伺服器獲取資料）。這是由於安全限制造成的（有關 Web 安全的更多資訊，請閱讀網站安全）。
它們包含伺服器端語言。伺服器端語言（如 PHP 或 Python）需要特殊的伺服器來解釋程式碼並傳遞結果。
它們包含其他檔案。瀏覽器通常將使用file://模式載入資源的請求視為跨域請求。因此，如果您載入包含其他本地檔案的本地檔案，這可能會觸發 CORS 錯誤。

執行簡單的本地 HTTP 伺服器

為了解決非同步請求的問題，我們需要透過本地 Web 伺服器執行這些示例來測試它們。

在程式碼編輯器中使用擴充套件

如果您只需要 HTML、CSS 和 JavaScript，並且不需要伺服器端語言，最簡單的方法可能是檢查程式碼編輯器中的擴充套件。除了自動為您的本地 HTTP 伺服器安裝和設定之外，它們還可以與您的程式碼編輯器很好地整合。在 HTTP 伺服器中測試本地檔案可能只需單擊一下即可。

對於 VSCode，您可以檢視以下免費擴充套件

vscode-preview-server。您可以在其主頁上檢視它。

使用 Node.js

Node.js http-server 模組是將 HTML 檔案託管在任何目錄中最簡單的方法。

要使用該模組

執行以下命令以檢查 Node.js 是否已安裝
bash
```
node -v
npm -v
npx -v
```
如果 Node.js 未安裝，您需要安裝它。請遵循 Node.js 文件中的下載說明，然後再次執行上述命令以檢查安裝是否成功。
假設該目錄為/path/to/project。執行以下命令以啟動伺服器
bash
```
npx http-server /path/to/project -o -p 9999
```
這將託管/path/to/project目錄中的所有檔案，位於localhost:9999。選項-o將在 Web 瀏覽器中開啟index.html頁面。如果index.html不存在，則會顯示該目錄。

使用 Python

另一種實現此方法的方法是使用 Python 的http.server模組。

注意：舊版本的 Python（最高版本 2.7）提供了一個名為SimpleHTTPServer的類似模組。如果您使用的是 Python 2.x，您可以按照本指南進行操作，將所有使用http.server的地方替換為SimpleHTTPServer。但是，我們建議您使用最新版本的 Python。

為此

安裝 Python。如果您使用的是 Linux 或 macOS，它應該已經在您的系統上可用。如果您是 Windows 使用者，您可以從 Python 主頁獲取安裝程式，並按照說明進行安裝
- 轉到 python.org
- 在下載部分，單擊 Python "3.xxx" 的連結。
- 在頁面底部，單擊Windows 安裝程式連結下載安裝程式檔案。
- 下載完成後，執行它。
- 在第一個安裝程式頁面上，確保選中“將 Python 3.xxx 新增到 PATH”複選框。
- 單擊安裝，然後在安裝完成後單擊關閉。
開啟您的命令提示符（Windows）/終端（macOS/Linux）。要檢查 Python 是否已安裝，請輸入以下命令
bash
```
python -V
# If the above fails, try:
python3 -V
# Or, if the "py" command is available, try:
py -V
```

這應該返回一個版本號。如果一切正常，請使用cd命令導航到包含要測試的網站程式碼的目錄。

bash

# include the directory name to enter it, for example
cd Desktop
# use two dots to jump up one directory level if you need to
cd ..

在該目錄中輸入命令以啟動伺服器

bash

# If Python version returned above is 3.X
# On Windows, try "python -m http.server" or "py -3 -m http.server"
python3 -m http.server
# If Python version returned above is 2.X
python -m SimpleHTTPServer

預設情況下，這將在本地 Web 伺服器上執行該目錄的內容，埠為 8000。您可以透過在 Web 瀏覽器中訪問 URL localhost:8000來訪問此伺服器。在這裡，您將看到該目錄的內容列表 - 單擊要執行的 HTML 檔案。

注意：如果您已經在埠 8000 上運行了其他內容，您可以透過執行伺服器命令後跟一個備用埠號來選擇另一個埠，例如python3 -m http.server 7800（Python 3.x）或python -m SimpleHTTPServer 7800（Python 2.x）。然後，您可以透過localhost:7800訪問您的內容。

在本地執行伺服器端語言

處理伺服器端語言（如 Python、PHP 或 JavaScript）的最佳方法取決於您使用的伺服器端語言，以及您是使用 Web 框架還是“獨立”程式碼。

如果您使用的是 Web 框架，通常該框架會提供自己的開發伺服器。例如，以下語言/框架附帶開發伺服器

Python Web 框架，例如 Django、Flask 和 Pyramid。
Node/JavaScript 框架，如 Express Web 框架（Node.js/JavaScript）

PHP 有自己的內建開發伺服器

bash

cd path/to/your/php/code
php -S localhost:8000

如果您沒有直接使用伺服器端框架或提供開發伺服器的程式語言，Python 的http.server模組也可以用於測試用 Python、PHP、JavaScript 等語言編寫的伺服器端程式碼，方法是呼叫伺服器端通用閘道器介面 (CGI) 指令碼。有關如何使用此功能的示例，請參見 realpython.com 上的如何在 Python 程式碼中用一行程式碼啟動 HTTP 伺服器中的透過通用閘道器介面 (CGI) 遠端執行指令碼。