WebStorm是一款深受廣大程序員喜愛的 JavaScript 開發(fā)和Web前端開發(fā)工具，完美適應(yīng)各種復(fù)雜客戶端開發(fā)和Node.js的服務(wù)器端 開發(fā)。 本文我們主要講解如何在WebStorm中使用REST API。

點(diǎn)擊下載WebStorm最新試用版

如果您正在使用RESTful應(yīng)用程序或正在開發(fā)REST API又或是在代碼中使用過它們 ，那么你可能對OpenAPI和Swagger有所了解。如果您不了解Swagger，那么你需要記住 Swagger是可以幫助您為API創(chuàng)建文檔的一組工具，而OpenAPI是用于描述REST API端點(diǎn)的格 式。

在此文中，我們將了解WebStorm如何幫助您創(chuàng)建和編輯API文檔，使用API調(diào)用編寫代碼以及測試調(diào)用。

首先，我們需要安裝OpenAPI Specification插件。從插件存儲庫或IDE Settings | Plugins項(xiàng)卡中的"Marketplace tab" 安裝它。

要在您的項(xiàng)目中創(chuàng)建新的API規(guī)范，請使用file “New…”菜單或“ project view” 中的“ new…”彈出窗口，然后選擇“ OpenAPI Specification”。您可以在JSON和YAML之間選擇。

WebStorm將在代碼完成彈出窗口中為您顯示帶有簡短描述的部分名稱，并且IDE還 將檢查該文件是否具有所有必需的部分。

如果您已有OpenAPI規(guī)范，則可以在IDE中看到一些使用Swagger UI構(gòu)建的文檔。使 用編輯器右上角的圖標(biāo)在編輯和預(yù)覽模式之間切換。本文檔是交互式的，您可以直接在此預(yù) 覽中測試端點(diǎn)。

代碼中完成API

規(guī)格文件中最重要的部分是" paths "部分列出了可用的端點(diǎn)及其支持的HTTP方法。在項(xiàng)目中的任何地方都有規(guī)格文件后，您就可以在JavaScript和TypeScript代碼中查看有關(guān)這些API的建議。

當(dāng)前，它們在兩種情況下顯示：

• 用 fetch()方法調(diào)用
• 從axios庫中使用get()或post()類似的方法

我們計(jì)劃在不久的將來增加對Express方法的支持。

在您的項(xiàng)目中擁有正確的OpenAPI規(guī)范不是從這些完成建議中受益的唯一方法–您還可以指定一個(gè)可以使用該規(guī)范的URL。為此，請轉(zhuǎn)到“Preferences/Settings | Languages and Frameworks | OpenAPI Specification”。單擊加號圖標(biāo)，然后將鏈接粘貼到JSON或YAML文件。

如果您使用的是某些第三方服務(wù)的API，則可以檢查GitHub上的openapi-directory存儲庫（在APIs文件夾中）是否有社區(qū)維護(hù)的OpenAPI規(guī)范。如果存在，則獲取指向規(guī)范文件的直接鏈接，并將該URL添加到IDE Preferences/Settings中

使用HTTP客戶端測試API調(diào)用

WebStorm具有內(nèi)置的HTTP客戶端，可用于測試REST API。

在OpenAPI規(guī)范文件中，您可以通過單擊方法旁邊的圖標(biāo)，以HTTP客戶端理解的格式快速生成新請求。然后，您可以根據(jù)需要使用代碼完成建議來添加其他參數(shù)。

或者，您可以使用意圖直接從JavaScript或TypeScript文件中創(chuàng)建新請求。 當(dāng)插入符號位于fetch或axios方法中URL上時(shí)按Alt + Enter，然后選擇Generate request。

您可以將授權(quán)和任何其他env變量存儲在特殊的位置（http-client.private.env.json文件–在WebStorm文檔中找到有關(guān)此內(nèi)容的更多信息）。

該插件具有許多有用的功能，您可以嘗試；我將重點(diǎn)介紹其中兩個(gè)。一種是與OpenAPI代碼生成器集成，您可以使用它來創(chuàng)建基于API規(guī)范的庫。另一個(gè)是“ 與最新規(guī)格修訂比較”操作，您可以從“ Find Action”彈出窗口中調(diào)用該操作（ Cmd / Ctrl + Shift + A） ），并用于查找項(xiàng)目的OpenAPI規(guī)范中引入的任何重大更改。

結(jié)束

今天的內(nèi)容就到這里，歡迎下載Webstorm體驗(yàn)最新功能并在下方評論區(qū)分享您對該產(chǎn)品的想法。您的反饋意見可幫助我們在以后的文章教程中找到正確的方向，慧都作為JetBrains的正版代理商現(xiàn)WebStorm正版授權(quán)最低僅售529！