[[341165]]

【51CTO.com快譯】如今，我們編寫(xiě)的許多代碼都依賴Web。畢竟，如果您可以向HTTP添加自定義載荷，為什么要開(kāi)發(fā)新協(xié)議?如果已經(jīng)有一個(gè)可擴(kuò)展、靈活又安全的層，無(wú)需在網(wǎng)絡(luò)堆棧中創(chuàng)建新的層。相反，我們可以充分利用HTTP中的GET和POST函數(shù)，并使用充分利用REST的API。

是的，這過(guò)于簡(jiǎn)單，但實(shí)際上很少有場(chǎng)合需要全新的東西。HTTP是一種簡(jiǎn)化，但也是一種混淆。如果我們使用的一切其底層都是HTTP，我們?yōu)楹螛?gòu)建可處理那些API的測(cè)試和開(kāi)發(fā)工具?

雖然Open API Initiative及其他方法對(duì)于規(guī)范如何描述和實(shí)現(xiàn)基于HTTP的API大有幫助，但我們通常把各種不同的工具拼湊起來(lái)以構(gòu)建和測(cè)試API調(diào)用。Postman可能是最流行最熟悉的工具，但是它與我們的開(kāi)發(fā)環(huán)境和瀏覽器分開(kāi)來(lái)，因此很難確信我們?cè)趹?yīng)用程序的上下文中設(shè)計(jì)和測(cè)試HTTP調(diào)用。

Edge開(kāi)發(fā)工具的Chromium演變

微軟在新的Edge瀏覽器中改用Chromium使它有機(jī)會(huì)擴(kuò)展其內(nèi)置的開(kāi)發(fā)工具，夯實(shí)其在Trident和EdgeHTML中開(kāi)發(fā)工具的自身歷史以及在Chromium開(kāi)源項(xiàng)目中所做的工作。這款瀏覽器穩(wěn)定版和開(kāi)發(fā)版的每個(gè)版本都增添了新工具，這些新工具在F12控制臺(tái)中和試驗(yàn)性標(biāo)志后面。

該實(shí)驗(yàn)性開(kāi)發(fā)工具值得探究，因?yàn)樗性S多實(shí)用的工具，雖然還沒(méi)有達(dá)到生產(chǎn)級(jí)水平，但仍可以幫助您解決代碼中的重大問(wèn)題。要開(kāi)啟它們，使用F12啟動(dòng)DevTools面板，然后在工具窗格或窗口的右上角點(diǎn)擊“設(shè)置”圖標(biāo)。在“設(shè)置”屏幕中，選擇“試驗(yàn)”，然后選擇想要使用的新功能。

最新的穩(wěn)定版Edge 85含有幾個(gè)試驗(yàn)性新工具，包括迫切需要的CSS Grid調(diào)試器。然而，最有意思的新功能讓您可以在新的Network Console(網(wǎng)絡(luò)控制臺(tái))中編輯和重放網(wǎng)絡(luò)事件。

結(jié)合使用Network Console和REST API

乍一看，這種方法可以記錄和分析HTTP請(qǐng)求，捕獲最近的活動(dòng)，并深入分析常規(guī)HTTP響應(yīng)代碼之外的服務(wù)器響應(yīng)。如果您在處理REST API，并使用瀏覽器進(jìn)行調(diào)試，就知道除了200 OK消息外，API還有很多其他意思，如果您通過(guò)REST代理或API代理來(lái)工作更是如此。知道為您的API充當(dāng)門(mén)面的HTTP服務(wù)器在運(yùn)行與知道API返回您期望的值不一樣。

Edge DevTools Network Console的真正優(yōu)點(diǎn)是，可以用它迅速試用HTTP API，無(wú)需編寫(xiě)任何代碼。您可能用過(guò)Postman之類的工具做到這點(diǎn)，但它們不在瀏覽器中，最適合從頭開(kāi)始開(kāi)發(fā)和測(cè)試API。Network Console的工作原理類似，為您提供了快速試用API URL的機(jī)制。

構(gòu)建和測(cè)試HTTP查詢

要測(cè)試API，從F12打開(kāi)空白的Network Console，然后點(diǎn)擊“創(chuàng)建請(qǐng)求”以打開(kāi)HTTP查詢構(gòu)建器。您可以從常見(jiàn)的HTTP查詢指令中進(jìn)行選擇，包括充分利用REST的API中所用的常見(jiàn)的POST和GET查詢。先使用常見(jiàn)的API資源管理器(比如微軟的Graph Explorer或Swagger Pet Store)，核查您在正確構(gòu)建請(qǐng)求，而且您了解如何使用身份驗(yàn)證令牌來(lái)處理受限制的API。

一旦完成了查詢，該工具會(huì)顯示狀態(tài)響應(yīng)、查詢所花的時(shí)間以及響應(yīng)大小。您可以下載響應(yīng)JSON來(lái)測(cè)試解析器，也可以在控制臺(tái)中預(yù)覽。除了響應(yīng)正文、所有標(biāo)頭和cookie外，內(nèi)置的JSON預(yù)覽還會(huì)解析響應(yīng)并顯示鍵/值對(duì)。

本質(zhì)上講，這是很簡(jiǎn)單的工具，但常常正是您需要的。現(xiàn)階段，最好將Edge DevTools Network Console視為一種快速的臨時(shí)測(cè)試工具。重放錄制網(wǎng)絡(luò)活動(dòng)的功能與服務(wù)器端性能測(cè)試工具結(jié)合使用大有幫助。您可以將相同的流量發(fā)送到服務(wù)器，以便自動(dòng)重現(xiàn)有問(wèn)題的交互。

在控制臺(tái)中編輯調(diào)用的功能很有用，因?yàn)槟梢詮捻?yè)面內(nèi)部?jī)?nèi)容捕獲API調(diào)用，然后將它們用作測(cè)試的基礎(chǔ)，并根據(jù)需要調(diào)整內(nèi)容。安全工程師會(huì)發(fā)覺(jué)這種方法很方便。他們可以識(shí)別針對(duì)網(wǎng)站或服務(wù)的潛在攻擊，然后對(duì)異常的載荷進(jìn)行試驗(yàn)以探究故障模式。

未來(lái)需要什么?

為了使這樣的工具可以替代Postman，它確實(shí)需要更多功能，比如能夠?qū)隣pen API定義。Swagger格式的JSON是交換來(lái)自開(kāi)放服務(wù)(比如Microsoft Graph)的API信息的標(biāo)準(zhǔn)方法。如果您可以將這些定義導(dǎo)入到Network Console中以選擇要測(cè)試的API(以及Open API自我文檔功能)，開(kāi)發(fā)人員可以使用瀏覽器來(lái)瀏覽可用的API，并在將定義導(dǎo)入到開(kāi)發(fā)環(huán)境之前對(duì)其進(jìn)行嘗試。就目前而言，有某種形式的導(dǎo)入函數(shù)，但尚不清楚集合或環(huán)境的含義，不過(guò)兩者都無(wú)法適用于Open API JSON文件。

微軟在努力向新的Edge輕松過(guò)渡，推出了一系列高質(zhì)量的穩(wěn)定版。很高興看到DevTools團(tuán)隊(duì)使用它進(jìn)行創(chuàng)新，并為開(kāi)發(fā)人員提供一套簡(jiǎn)便的瀏覽器內(nèi)工具，可讓您深入了解代碼的運(yùn)作方式。新的Network Console在此基礎(chǔ)上更進(jìn)一步，可以處理您的API。

遺憾的是，該工具尚無(wú)法與面向Visual Studio Code的Edge Network插件配合使用，但是很容易看到將來(lái)的更新版如何支持您的本地API開(kāi)發(fā)，幫助您無(wú)需離開(kāi)編輯器就可以在本地系統(tǒng)上構(gòu)建和測(cè)試REST API。有了Code的Electron基礎(chǔ)，微軟就比較容易添加這樣的瀏覽器工具，以一種迫切需要的、對(duì)開(kāi)發(fā)人員友好的方式，打破編輯器和運(yùn)行時(shí)環(huán)境之間的壁壘。

原文標(biāo)題：Analyzing web application APIs using Edge DevTools，作者：Simon Bisson

【51CTO譯稿，合作站點(diǎn)轉(zhuǎn)載請(qǐng)注明原文譯者和出處為51CTO.com】