伺服器端入門
歡迎來到 MDN 初學者伺服器端程式設計課程！在本文的第一部分，我們將從較高的層面瞭解伺服器端程式設計，回答諸如“什麼是伺服器端程式設計？”、“它與客戶端程式設計有何區別？”以及“為什麼它如此有用？”等問題。閱讀完本文後，您將瞭解透過伺服器端編碼為網站提供的額外功能。
| 先決條件 | 對 Web 伺服器的基本瞭解。 |
|---|---|
| 目標 | 熟悉什麼是伺服器端程式設計、它能做什麼以及它與客戶端程式設計有何區別。 |
大多數大型網站都使用伺服器端程式碼在需要時動態顯示不同的資料，通常是從儲存在伺服器上的資料庫中提取資料，並透過某些程式碼（例如 HTML 和 JavaScript）傳送到客戶端進行顯示。
也許伺服器端程式碼最顯著的好處是它允許您為個別使用者定製網站內容。動態網站可以根據使用者的偏好和習慣突出顯示更相關的內容。它還可以透過儲存個人偏好和資訊來簡化網站的使用，例如重複使用儲存的信用卡資訊來簡化後續付款。
它甚至可以允許與網站使用者互動，透過電子郵件或其他渠道傳送通知和更新。所有這些功能都能實現更深層次的使用者互動。
在現代 Web 開發領域，學習伺服器端開發是強烈推薦的。
什麼是伺服器端網站程式設計？
Web 瀏覽器使用**超文字傳輸協議**（HTTP）與Web 伺服器通訊。當您點選網頁上的連結、提交表單或執行搜尋時，瀏覽器會向目標伺服器傳送一個**HTTP 請求**。
請求包括一個標識受影響資源的 URL、定義所需操作的方法（例如獲取、刪除或釋出資源），並可能包含編碼在 URL 引數中的其他資訊（透過查詢字串傳送的欄位-值對），作為 POST 資料（由HTTP POST 方法傳送的資料），或包含在關聯的cookie中。
Web 伺服器等待客戶端請求訊息，在訊息到達時處理它們，並使用**HTTP 響應**訊息回覆 Web 瀏覽器。響應包含一個狀態行，指示請求是否成功（例如，成功時的“HTTP/1.1 200 OK”）。
對請求的成功響應的主體將包含請求的資源（例如，一個新的 HTML 頁面或影像），然後 Web 瀏覽器可以顯示該資源。
靜態網站
動態網站
動態網站是指某些響應內容是動態生成的，僅在需要時生成。在動態網站上，HTML 頁面通常透過將資料從資料庫插入 HTML 模板中的佔位符來建立（這是一種比使用靜態網站更有效地儲存大量內容的方法）。
動態網站可以根據使用者提供的資訊或儲存的偏好返回 URL 的不同資料，並且可以在返回響應的過程中執行其他操作（例如傳送通知）。
支援動態網站的大部分程式碼必須在伺服器上執行。建立此程式碼稱為“伺服器端程式設計”（有時也稱為“後端指令碼”）。
下圖顯示了動態網站的簡單架構。與上圖一樣，瀏覽器向伺服器傳送 HTTP 請求，然後伺服器處理這些請求並返回相應的 HTTP 響應。
對靜態資源的請求以與靜態網站相同的方式處理（靜態資源是指不會更改的任何檔案，通常包括：CSS、JavaScript、影像、預先建立的 PDF 檔案等）。
對動態資源的請求則會被轉發 (2) 到伺服器端程式碼（在圖中顯示為Web 應用程式）。對於“動態請求”，伺服器會解釋請求，從資料庫中讀取所需的資訊 (3)，將檢索到的資料與 HTML 模板組合 (4)，併發送包含生成的 HTML 的響應 (5,6)。
伺服器端和客戶端程式設計是否相同？
現在讓我們將注意力轉向伺服器端和客戶端程式設計中涉及的程式碼。在每種情況下，程式碼都大不相同。
- 它們具有不同的目的和關注點。
- 它們通常不使用相同的程式語言（例外情況是 JavaScript，它可以在伺服器端和客戶端使用）。
- 它們在不同的作業系統環境中執行。
在瀏覽器中執行的程式碼稱為客戶端程式碼，主要關注於改進渲染的網頁的外觀和行為。這包括選擇和設定 UI 元件的樣式、建立佈局、導航、表單驗證等。相比之下，伺服器端網站程式設計主要涉及選擇哪個內容作為對請求的響應返回到瀏覽器。伺服器端程式碼處理諸如驗證提交的資料和請求、使用資料庫儲存和檢索資料以及根據需要向客戶端傳送正確的資料等任務。
客戶端程式碼使用HTML、CSS和JavaScript編寫，它在 Web 瀏覽器中執行，並且對底層作業系統（包括對檔案系統的訪問許可權有限）的訪問許可權很少或沒有。
Web 開發人員無法控制每個使用者可能使用什麼瀏覽器來檢視網站——瀏覽器對客戶端程式碼功能提供了不一致的相容性級別，客戶端程式設計面臨的挑戰之一是以優雅的方式處理瀏覽器支援的差異。
伺服器端程式碼可以用任意數量的程式語言編寫——流行的伺服器端 Web 語言示例包括 PHP、Python、Ruby、C# 和 JavaScript (NodeJS)。伺服器端程式碼可以完全訪問伺服器作業系統，並且開發人員可以選擇他們希望使用的程式語言（以及特定版本）。
開發人員通常使用Web 框架編寫程式碼。Web 框架是函式、物件、規則和其他程式碼結構的集合，旨在解決常見問題、加快開發速度並簡化特定領域中面臨的不同型別的任務。
同樣，雖然客戶端和伺服器端程式碼都使用框架，但它們的領域非常不同，因此框架也不同。客戶端 Web 框架簡化了佈局和展示任務，而伺服器端 Web 框架提供了許多您可能需要自己實現的“常見”Web 伺服器功能（例如，對會話的支援、對使用者和身份驗證的支援、簡單的資料庫訪問、模板庫等）。
注意：客戶端框架通常用於幫助加快客戶端程式碼的開發速度，但您也可以選擇手動編寫所有程式碼；事實上，如果您只需要一個小型簡單的網站 UI，則手動編寫程式碼可能會更快更有效。
相反，您幾乎永遠不會考慮在沒有框架的情況下編寫 Web 應用程式的伺服器端元件——從頭開始實現像 HTTP 伺服器這樣的重要功能在 Python 中非常困難，但像 Django 這樣的 Python Web 框架提供了一個開箱即用的 HTTP 伺服器，以及其他非常有用的工具。
您可以在伺服器端做什麼？
伺服器端程式設計非常有用，因為它允許我們高效地傳遞為個別使用者量身定製的資訊，從而創造更好的使用者體驗。
像亞馬遜這樣的公司使用伺服器端程式設計來構建產品搜尋結果、根據客戶偏好和之前的購買習慣提供有針對性的產品建議、簡化購買流程等。
銀行使用伺服器端程式設計來儲存賬戶資訊，並僅允許授權使用者檢視和進行交易。其他服務，如 Facebook、Twitter、Instagram 和維基百科，使用伺服器端程式設計來突出顯示、共享和控制對有趣內容的訪問。
下面列出了一些伺服器端程式設計的常見用途和好處。您會注意到它們之間有一些重疊！
高效的資訊儲存和傳遞
想象一下亞馬遜上有多少產品，以及 Facebook 上釋出了多少帖子？為每個產品或帖子建立一個單獨的靜態頁面將完全不切實際。
伺服器端程式設計允許我們改為將資訊儲存在資料庫中，並動態構建和返回 HTML 及其他型別的檔案（例如 PDF、影像等）。還可以返回資料（JSON、XML 等），以便由相應的客戶端 Web 框架渲染（這減少了伺服器的處理負擔以及需要傳送的資料量）。
伺服器不僅限於傳送來自資料庫的資訊，還可以返回軟體工具的結果或來自通訊服務的資料。內容甚至可以針對接收它的客戶端裝置型別進行定位。
由於資訊儲存在資料庫中，因此也可以更輕鬆地與其他業務系統共享和更新（例如，當產品線上或在商店中出售時，商店可能會更新其庫存資料庫）。
注意：您無需費力地就能看出伺服器端程式碼對高效儲存和傳遞資訊的好處。
- 訪問亞馬遜或其他電子商務網站。
- 搜尋一些關鍵詞，並注意即使結果不同，頁面結構也不會改變。
- 開啟兩個或三個不同的產品。再次注意，它們具有相同的結構和佈局，但不同產品的內容是從資料庫中提取的。
對於一個常見的搜尋詞（例如“魚”），您可以看到數百萬個返回結果。使用資料庫可以有效地儲存和共享這些結果，並且可以在一個地方控制資訊的展示方式。
自定義使用者體驗
伺服器可以儲存和使用有關客戶端的資訊，以提供便捷且定製的使用者體驗。例如，許多網站儲存信用卡資訊，以便無需再次輸入詳細資訊。像 Google Maps 這樣的網站可以使用儲存的或當前的位置提供路線資訊，並使用搜索或旅行歷史記錄突出顯示搜尋結果中的本地企業。
對使用者習慣進行更深入的分析可以用於預測他們的興趣並進一步自定義響應和通知，例如提供您可能想在地圖上檢視的先前訪問過或熱門地點的列表。
注意：Google Maps 會儲存您的搜尋和訪問歷史記錄。經常訪問或經常搜尋的地點會比其他地點更突出顯示。
Google 搜尋結果根據之前的搜尋進行最佳化。
- 訪問Google 搜尋。
- 搜尋“足球”。
- 現在嘗試在搜尋框中輸入“收藏”，並觀察自動完成搜尋預測。
巧合？絕非如此！
控制對內容的訪問
伺服器端程式設計允許網站限制對授權使用者的訪問，並僅提供使用者有權檢視的資訊。
現實世界的例子包括社交網路網站，這些網站允許使用者確定誰可以檢視他們釋出到網站上的內容，以及誰的內容出現在他們的資訊流中。
注意：考慮其他內容訪問受控的真實示例。例如，如果您訪問銀行的線上網站，您能看到什麼？登入您的帳戶 - 您還能看到和修改哪些其他資訊？哪些資訊只有銀行才能更改？
儲存會話/狀態資訊
伺服器端程式設計允許開發人員利用會話——基本上，這是一種機制，允許伺服器儲存與網站當前使用者相關的資訊，並根據這些資訊傳送不同的響應。
例如，這允許網站知道使用者之前已登入並顯示其電子郵件或訂單歷史記錄的連結，或者可能儲存簡單遊戲的狀態，以便使用者可以再次訪問網站並從離開的地方繼續。
注意：訪問一個採用訂閱模式的新聞網站並開啟多個標籤頁（例如 The Age）。在幾個小時/幾天內繼續訪問該網站。最終，您將開始被重定向到解釋如何訂閱的頁面，並且您將無法訪問文章。此資訊是儲存在 Cookie 中的會話資訊的示例。
通知和通訊
伺服器可以透過網站本身或透過電子郵件、簡訊、即時訊息、影片對話或其他通訊服務傳送通用或使用者特定的通知。
一些示例包括
- Facebook 和 Twitter 傳送電子郵件和簡訊通知您新的通訊。
- 亞馬遜定期傳送產品電子郵件，建議您可能感興趣的與之前購買或檢視的產品類似的產品。
- Web 伺服器可能會向站點管理員傳送警告訊息，提醒他們伺服器記憶體不足或使用者活動可疑。
注意：最常見的通知型別是“註冊確認”。選擇您感興趣的任何大型網站（Google、Amazon、Instagram 等），並使用您的電子郵件地址建立一個新帳戶。您將很快收到一封電子郵件確認您的註冊，或要求您確認以啟用您的帳戶。
資料分析
網站可能會收集大量有關使用者的資料：他們搜尋的內容、他們購買的內容、他們推薦的內容、他們在每個頁面停留的時間。伺服器端程式設計可用於根據對這些資料的分析來最佳化響應。
例如，亞馬遜和谷歌都根據之前的搜尋（和購買）投放產品廣告。
注意：如果您是 Facebook 使用者，請訪問您的主資訊流並檢視帖子流。請注意，一些帖子並非按數字順序排列——特別是，“點贊”較多的帖子通常比最近的帖子排在更前面。
還可以檢視您正在檢視的廣告型別——您可能會看到在其他網站上檢視的內容的廣告。Facebook 用於突出顯示內容和廣告的演算法可能有點神秘，但很明顯，它確實取決於您的喜好和觀看習慣！