有选择地禁用 swaggerUI 中的“尝试一下”

Question

尽管这里有关于该主题的长时间讨论：https://github.com/swagger-api/swagger-ui/issues/156

我还没有找到更干净的方法来“有选择地”禁用“试用”按钮。 我想对我的 API 的所有 POST 方法禁用它。

提前谢谢您

Answer 1

Swagger UI 3.10.0+ 和 2.x 提供

supportedSubmitMethods

选项来控制哪些 HTTP 方法已启用“尝试”（默认 = 全部）。

要禁用 POST 的“尝试一下”（但不是 PATCH/PUT）：

// index.html (Swagger UI 3.10+)

const ui = SwaggerUIBundle({
  url: "http://my.api.com/openapi.yaml",
  supportedSubmitMethods: ["get", "delete", "options", "head", "patch", "trace"], // No "post"
  ...
})

要对除 GET 和 HEAD 之外的所有方法禁用“尝试一下”：

  supportedSubmitMethods: ["get", "head"],

Answer 2

如果您使用 OpenAPI，您可以通过环境设置来控制它，如果您有多个安装，这会很好

例如，这仅启用 get 和 put 动词。 SPRINGDOC_SWAGGER_UI_SUPPORTED_SUBMIT_METHODS=获取、放置

参见 https://springdoc.github.io/springdoc-openapi-demos/springdoc-properties.html 获取动词列表（只是常见的 http 动词）

Answer 3

对我来说，当使用tryItOutEnabled选项和false值时，尝试一下不会被禁用，如文档

所建议的那样

<SwaggerUI 
      url= {url}
      tryItOutEnabled={false}
/>

但是简单的 CSS 技巧救了我的命，从技术上讲，尝试一下按钮是在下面的 HTML 元素的帮助下显示的

<button class="btn try-out__btn">Try it out </button>

我们可以借助下面的 CSS 属性禁用上面的元素

.try-out {
  display: none !important;
}

当 React 组件加载上述 CSS 属性时，Try it out 按钮将被禁用。就是这样。享受！快乐编码...！