如何删除 Swagger UI 标题下的 API 定义 URL？

Question

我正在使用 Swagger UI 并希望删除显示在标题部分下方的 API 定义 URL（link 到 YAML 文件），如突出显示图片。这可以通过自定义 Swagger UI index.html 页面来完成吗？

Answer 1

选项 1：使用 CSS

隐藏

<!-- index.html -->

<style>
...

.swagger-ui .info hgroup.main a {
  display: none
}
</style>

选项 2：使用 JavaScript (v.3.13.0+)

隐藏

Swagger UI 3.x 使用插件系统来控制渲染。您可以定义一个禁用 InfoUrl 组件的自定义插件 - 这将阻止呈现 API 定义 link。这种方法适用于 Swagger UI 3.13.0 及更高版本。

// index.html

window.onload = function() {

  // Custom plugin to hide the API definition URL
  const HideInfoUrlPartsPlugin = () => {
    return {
      wrapComponents: {
        InfoUrl: () => () => null
      }
    }
  }

  // Build a system
  const ui = SwaggerUIBundle({
    ...
    plugins: [
      SwaggerUIBundle.plugins.DownloadUrl,
      HideInfoUrlPartsPlugin    // <---- Apply the plugin
    ],
    ...
  })

Source

如何删除 Swagger UI 标题下的 API 定义 URL？

How to remove the API definition URL under title in Swagger UI?

swagger

swagger-ui

选项 1：使用 CSS

选项 2：使用 JavaScript (v.3.13.0+)