less than 1 minute read

不依賴套件,手動設定Swagger設定檔, 輸出成web頁面

swagger clone 最新版本, 並將dist資料夾複製到專案中

並將swagger的設定檔 檔案放到dist資料夾中, 這邊範例檔名為testswagger.yaml, 最後需套用該設定檔

testswagger.yaml

openapi: 3.0.0
info:
  contact:
    name: "test swagger UI"
  title: "Swagger Demo"
  version: "1.0"
servers:
  - url: http://localhost:8080
    description: demo
paths:
  "/hello-world":
    get:
      responses:
        "200":
          description: OK
          content:
            text/plain:
              schema:
                type: string
      tags:
        - DemoSwagger

dist目錄結構

dist
├── favicon-16x16.png
├── favicon-32x32.png
├── index.css
├── index.html
├── oauth2-redirect.html
├── swagger-initializer.js
├── swagger-ui-bundle.js
├── swagger-ui-bundle.js.map
├── swagger-ui.css
├── swagger-ui.css.map
├── swagger-ui-es-bundle-core.js
├── swagger-ui-es-bundle-core.js.map
├── swagger-ui-es-bundle.js
├── swagger-ui-es-bundle.js.map
├── swagger-ui.js
├── swagger-ui.js.map
├── swagger-ui-standalone-preset.js
├── swagger-ui-standalone-preset.js.map
└── testswagger.yaml

dist套用swagger設定檔

需將dist中的swagger-initializer.js中讀取的swagger設定檔指向 testswagger.yaml

window.onload = function() {
  //<editor-fold desc="Changeable Configuration Block">

  // the following lines will be replaced by docker/configurator, when it runs in a docker-container
  window.ui = SwaggerUIBundle({
    url: "./testswagger.yaml",  // 設定檔位置
    dom_id: '#swagger-ui',
    deepLinking: true,
    presets: [
      SwaggerUIBundle.presets.apis,
      SwaggerUIStandalonePreset
    ],
//    plugins: [  // 這邊是想關掉topbar 不關不影響
//      SwaggerUIBundle.plugins.DownloadUrl
//    ],
//    layout: "StandaloneLayout"
  });

  //</editor-fold>
};

啟動web server

最後啟動一個web server, 並將dist資料夾放到web server中
這邊簡單使用golang的http server來啟動web server
啟動後可訪問 http://localhost:8080/docs/ 來瀏覽swagger文檔 j

package main

import (
	"fmt"
	"net/http"
)

func HelloWorld(rw http.ResponseWriter, r *http.Request) {
	content := fmt.Sprintf("hello world!")
	fmt.Fprint(rw, content)
}

func main() {
	http.HandleFunc("/hello-world", HelloWorld)

	fs := http.FileServer(http.Dir("./dist")) // Swagger UI files handler
	http.Handle("/docs/*", http.StripPrefix("/docs/", fs))

	http.ListenAndServe(":8080", nil)
}