摘要：原文譯者如果你曾經(jīng)去過一個(gè)坐下來就餐的餐廳，那么你可以了解的基礎(chǔ)知識(shí)。而且由于缺少路徑，它將在每個(gè)請(qǐng)求上運(yùn)行。這就是路由的來源。到目前為止，你已經(jīng)雇傭了一位經(jīng)理，在接受客戶請(qǐng)求之前定義了要做的事情，并且確定如何處理特定的客戶請(qǐng)求。

原文：Going out to eat and understanding the basics of Express.js
譯者：neal1991
welcome to star my articles-translator , providing you advanced articles translation. Any suggestion, please issue or contact me
LICENSE: MIT

如果你曾經(jīng)去過一個(gè)坐下來就餐的餐廳，那么你可以了解 Express 的基礎(chǔ)知識(shí)。 但是，如果你剛剛開始構(gòu)建你的第一個(gè) Node.js 后端......你可能并不會(huì)很順利。

是的 - 如果你曾經(jīng)有過 JavaScript 經(jīng)驗(yàn)，學(xué)習(xí) Node 肯定更容易。 但是，在構(gòu)建后端時(shí)面臨的挑戰(zhàn)與在前端使用JavaScript 時(shí)所面臨的挑戰(zhàn)完全不同。

當(dāng)我學(xué)習(xí)Node時(shí)，我選擇了困難的方式。 我一遍又一遍地學(xué)習(xí)電子書，寫作教程和視頻，直到我終于明白我為什么要做我正在做的事情。

有一個(gè)更簡(jiǎn)單的方法。 我打算用一個(gè)餐館的比喻來解釋你的第一個(gè)應(yīng)用程序的四個(gè)關(guān)鍵部分。 Express.js 是一個(gè)組織你的代碼的流行框架，我會(huì)為任何初學(xué)者推薦它。 稍后我會(huì)進(jìn)一步解釋。

下面是我們將會(huì)涉及到的四個(gè)關(guān)鍵部分：

The require statements

Middleware

Routing

App.listen()/ Starting the server

在這個(gè)比喻中，你是一個(gè)餐館老板，希望雇用一個(gè)總經(jīng)理 - 創(chuàng)建所有流程并且進(jìn)行管理，這樣餐廳就可以順利運(yùn)行，客戶也就快樂了。

下面是接下來部分的預(yù)覽：

最后，你將會(huì)理解基本 Express app 的每個(gè)部分的功能。

在這個(gè)例子中，你是餐館老板。 而且你需要聘請(qǐng)專家來管理你的新餐廳的日常運(yùn)作。 你當(dāng)然不是專家，你不能把它交給服務(wù)員和廚房去搞清楚。

如果你想經(jīng)營(yíng)一家高效安全的餐廳，你需要有人來保證你的員工以最高的效率工作。 Express 就是新的經(jīng)理。

第一部分非常簡(jiǎn)單。 與其他 NPM 軟件包一樣，你需要使用 npm 安裝 express 模塊，然后使用 require statement 來加載模塊。

不像其它的許多 NPM 包，你也需要使用這行：

const app = express();

這是因?yàn)槟阈枰粋€(gè)變量來保存你的新的 Express 應(yīng)用程序。 Express 不是 Node 的默認(rèn)部分。

讓我們?cè)谶@停一下。餐廳里最常見的例程有哪些？我們腦海中立馬出現(xiàn)了3個(gè)：

給新顧客安排座位

接受食物訂單

在用餐結(jié)束進(jìn)行確認(rèn)

對(duì)于每一個(gè)例程，都需要進(jìn)行一系列的進(jìn)程才能執(zhí)行行動(dòng)。比如，在你給顧客安排座位之前，你需要知道：

他們是不是穿了襯衫和鞋子（以及褲子）？否則，他們不能被安排座位。

如果他們想坐在吧臺(tái)那里，他們是否已經(jīng)有21歲（如果你在美國(guó)的話）

這不是海灘酒吧！ 同樣，在你的代碼中，你需要驗(yàn)證請(qǐng)求是否具有某些標(biāo)準(zhǔn)，然后才能繼續(xù)。 例如，如果有人嘗試登錄到你的網(wǎng)站：

他們是否具有賬戶？

他們是否輸入了正確的密碼？

這是 middleware 概念的來源。Middleware 功能允許你對(duì)任何傳入的請(qǐng)求采取行動(dòng)，并在發(fā)回響應(yīng)之前對(duì)其進(jìn)行修改。

在你的餐廳，你需要一系列的規(guī)則來決定你是否應(yīng)該接待來訪的人。 比方說，一對(duì)夫婦走進(jìn)你的餐廳。 在給他們一張桌子之前，你有一條規(guī)則：他們穿著襯衫和鞋子嗎？

首先，你從app.use()開始。這意味著這些僅僅是下一個(gè)路線需要應(yīng)用的規(guī)則。它們不是 GET，POST，PUT或DELETE。

在第四行，你有一個(gè)匿名函數(shù)，參數(shù) req，res 和 next。對(duì)于這個(gè)代碼塊的目的，你只是檢查請(qǐng)求（req），看它是否有襯衫和鞋子。

你最后還需要使用next()函數(shù)，因?yàn)槟阒皇窃谶@里驗(yàn)證服裝。之后，在路線中，你將允許客人獲得實(shí)際的桌子。

在第五行和第六行，你檢查他們是否有襯衫和鞋子。

而在第7-9行中，只有兩者兼而有之才行。

上面的代碼塊缺少一個(gè)重要的事情：一個(gè)路徑。這是請(qǐng)求中包含的特定字符串。而且由于缺少路徑，它將在每個(gè)請(qǐng)求上運(yùn)行。

你可以想象？當(dāng)顧客進(jìn)入餐館...點(diǎn)了食物...要求支票...員工將被迫在他們上下看他們確定他們穿衣服！這是一個(gè)快速停業(yè)的辦法。

所以，我們?cè)谏厦娴睦又懈淖兊?行。 現(xiàn)在，我們只會(huì)在用戶請(qǐng)求“/ table”路徑時(shí)運(yùn)行這個(gè)代碼。

完整的解釋：

讓我們繼續(xù)就座的例子。 到目前為止，我們只知道如何驗(yàn)證某人是否應(yīng)該就做。 但是我們實(shí)際上并不知道如何把他們指引到桌子旁邊并且就坐。

這就是路由的來源。路由允許我們根據(jù)路徑編寫具體的行動(dòng)。 選項(xiàng)是 GET，POST ，PUT 和 DELETE，但現(xiàn)在我們將重點(diǎn)介紹 GET 和 POST。

在餐廳的環(huán)境下，我們需要?jiǎng)?chuàng)建一個(gè) GET 請(qǐng)求，以便選擇一個(gè)特定的桌子并安排客人就做。 GET 不會(huì)修改或添加新數(shù)據(jù)到你的數(shù)據(jù)庫(kù)。 他們只是檢索基于特定參數(shù)的信息。

在這種情況下，假設(shè)你需要?jiǎng)?chuàng)建一個(gè)程序來安排兩個(gè)派對(duì)。 2號(hào)來自客戶的要求。

好的，在我解釋之前：是的，這只是在最后發(fā)送信息。 實(shí)際上還沒有找到一個(gè)具體的表格來給客戶安排座位。 我需要在一個(gè)數(shù)組中搜索一個(gè)打開的表格，這涉及到更多的背景故事......這超出了本教程的范圍。

在第12行中，我們定義了當(dāng)賓客請(qǐng)求"table"路由時(shí)查找表的過程。 就像上面的中間件示例一樣，我們有可用的請(qǐng)求和響應(yīng)參數(shù)。 它也有一個(gè)參數(shù)，金額。 在這個(gè)例子中，這是兩個(gè)。

事實(shí)上，第12行函數(shù)聲明之后的所有內(nèi)容在技術(shù)上都是middleware，因?yàn)樗薷牧擞脩粽?qǐng)求。 你會(huì)看到圖中的結(jié)尾。

在第13行中，我們從請(qǐng)求對(duì)象的參數(shù)中訪問聚會(huì)中的人數(shù)。 由于請(qǐng)求來自用戶，所以沒有聲明任何地方，我們沒有任何前端代碼。 所以如果這是一個(gè)真正的應(yīng)用程序，請(qǐng)求可能如下所示：

req = {
  params: {
    amount: 2;
  }
}

在第13行中，我們的 party 變量訪問請(qǐng)求中的 params 對(duì)象的 amount 屬性。

最后在第14行，我們發(fā)送響應(yīng)給客戶：我們正在尋找合適的桌子。

這是一次很多。 下面一張圖表：

現(xiàn)在您可以追蹤從請(qǐng)求到響應(yīng)的完整路徑。 但是，隨著你的應(yīng)用程序的規(guī)模不斷擴(kuò)大，你將不希望多帶帶為每條路由編碼規(guī)則。 你會(huì)發(fā)現(xiàn)一些路由共享相同的規(guī)則，所以你需要找到一種方法來將一組規(guī)則應(yīng)用到多個(gè)路由。

就座位而言，您可以將你的客戶安置在吧臺(tái)或餐桌旁。 他們有襯衫和鞋子的共同規(guī)則，但是在酒吧里坐著要求每個(gè)人都超過 21歲。

而且，在服務(wù)客戶方面，你需要使用稍微不同的程序來供應(yīng)開胃菜，主菜和晚餐。 但是，這三條路線也有很多共同之處。

這是路由器進(jìn)來的地方。路由器讓你分組你的路由，這樣你就可以創(chuàng)建通用的規(guī)則。

我們需要?jiǎng)?chuàng)建 middleware 來覆蓋這些情況。 現(xiàn)在我會(huì)將考慮到上面的就座案例，對(duì)上面的代碼進(jìn)行重寫。

這是完整的代碼片段：

我們的路由器。

在第6行和第14行，我們現(xiàn)在使用seatingRouter.use（）來代替app.use（）來表示這個(gè)中間件只與seatRouter路由有關(guān)。

最后，在第21行中，我們添加了更多的中間件，以顯示每個(gè)座位路由器以“/ seating”開頭。 所以，如果有人要求在酒吧坐一個(gè)座位，完整的路徑是"/ seating / bar"，這可能會(huì)有點(diǎn)不合理，因?yàn)楫?dāng)你在第4行創(chuàng)建路由器時(shí)，你可能會(huì)預(yù)期路徑被定義。 這很正常！

這里是以圖表的形式：

并且當(dāng)你添加一個(gè) GET 路由的時(shí)候， 它將會(huì)轉(zhuǎn)到你上面分配的路由。

好吧，最后一部分。 到目前為止，你已經(jīng)雇傭了一位經(jīng)理，在接受客戶請(qǐng)求之前定義了要做的事情，并且確定如何處理特定的客戶請(qǐng)求?，F(xiàn)在，你只需確定所需位置的地址即可。

你的服務(wù)器端口有點(diǎn)像餐廳本身的地址。 由于你的服務(wù)器可以同時(shí)處理多種類型的餐廳（或服務(wù)器端腳本），因此你需要告知每個(gè)腳本應(yīng)在哪里運(yùn)行。

在上面的例子中，端口是 3000，它位于你的計(jì)算機(jī)上。 所以如果你輸入：

? https://localhost:3000/

在你的瀏覽器中，并且你在運(yùn)行你的 Node 應(yīng)用程序，服務(wù)器知道運(yùn)行特定的腳本。 在這種情況下，只要輸入U(xiǎn)RL，您將在控制臺(tái)中記錄消息，并能夠使用任何路由。 如果餐廳本身是您的電子商務(wù)應(yīng)用程序，那么它現(xiàn)在在地址 3000 處開始營(yíng)業(yè)。

你喜歡這個(gè)教程嗎？ 給它點(diǎn)贊，讓別人也可以發(fā)現(xiàn)它。