Swagger UI教程 API 文檔神器 搭配Node使用

在團(tuán)隊(duì)開發(fā)中,一個好的 API 文檔可以減少很多交流成本,也可以使一個新人快速上手業(yè)務(wù)。

前言

  • swagger ui是一個API在線文檔生成和測試的利器,目前發(fā)現(xiàn)最好用的。
  • 為什么好用?Demo 傳送門
    • 支持API自動生成同步的在線文檔
      • 這些文檔可用于項(xiàng)目內(nèi)部API審核
      • 方便測試人員了解API
    • 這些文檔可作為客戶產(chǎn)品文檔的一部分進(jìn)行發(fā)布
      • 支持API規(guī)范生成代碼,生成的客戶端和服務(wù)器端骨架代碼可以加速開發(fā)和測試速度

總結(jié)一句話就是好用,逼格高。下面我將總結(jié)一下如何快速在本地搭建一個基于Node和Swagger UI的 API 的文檔工具

環(huán)境搭建

  • 下載Swagger UI(也可以直接下載 zip 文件)
git clone https://github.com/swagger-api/swagger-ui.git
  • 安裝 express
  • 創(chuàng)建一個空文件夾node_app
mkdir node_app
  • 初始化 node ,創(chuàng)建package.json文件()
?  ~ ? >cd node_ap
?  ~/node_app ? >npm init
// 下面的看你心情填寫
name: (node_app) node_app
version: (1.0.0)
description:
entry point: (index.js)
test command:
git repository:
keywords:
author:
license: (ISC)
  • 安裝 express
? ~/node_app git:(master) ? >npm install express --save
  • 創(chuàng)建 index.js
?  ~/node_app git:(master) ? >vim index.js
  • 把下面代碼貼如 index.js 中
var express = require('express');
var app = express();
app.get('/', function (req, res) {
  res.send('Hello World!');
});

app.listen(3000, function () {
  console.log('Example app listening on port 3000!');
});
  • 在 node_app 中創(chuàng)建空目錄 public
?  ~/node_app git:(master) ? >mkdir public
?  ~/node_app git:(master) ? >cd public
  • 修改路由
?  ~/node_app/public git:(master) ? >vim ../index.js
//在文件第三行插入下面這句話
app.use('/static', express.static('public'));
  • 把下載好的Swagger UI 文件中dist 目錄下的文件全部復(fù)制到 public 文件夾下。


    目錄結(jié)構(gòu)
  • 開啟 node
?  ~/node_app git:(master) ? >node index.js

到此為止,你已經(jīng)把官方的 demo 在本地配置好了。當(dāng)然你也可以吧這個搭建在服務(wù)器上

編寫文檔并發(fā)布

  • 使用Swagger Editor編寫 API 文檔
    • Swagger Editor 上的是基于 yaml 的語法,但是不用害怕,看著官方的 demo 看個10分鐘就會了。
  • 導(dǎo)出 test.json 文檔


    導(dǎo)出方式
  • 把 test.json 放到 node_app/public 目錄下。
  • 利用編輯器修改 url = "http://petstore.swagger.io/v2/swagger.json";url = "/static/test.json";
  • 重啟 node 服務(wù),瀏覽器中打開http://localhost:3000/static/index.html就是你自己寫的 api 文檔了

效果圖

自己寫的 API 接口
PUT請求
GET請求
POST 請求
DELETE 請求
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容