如何在<redoc>中添加选项？

Question

我想为我的 ReDoc 添加一些额外的选项。对于当前的实现，我使用的是从 Swagger 生成的 json 文件，并将其添加到 html 页面中。如何完成的示例：

  <body>
    <redoc spec-url='http://petstore.swagger.io/v2/swagger.json'></redoc>
    <script src="https://cdn.jsdelivr.net/npm/redoc@next/bundles/redoc.standalone.js"> </script>
  </body>

我将其用作参考文档：https://github.com/Rebilly/ReDoc

如何在标签中添加选项对象而不使用 ReDoc 对象？以及如何使用供应商扩展，例如x标志？在文档中，这是通过 json 文件设置的，但我的 json 文件是从 Swagger 自动生成的。

Answer 1

ReDoc 通过 Redoc.init 进行了高级初始化，因此您可以手动下载规范并添加一些后处理（例如添加 x-logo）。

您可以将 ReDoc 选项作为第二个参数传递给 Redoc.init:

<body>
  <div id="redoc"></div>
  <script src="https://cdn.jsdelivr.net/npm/redoc@next/bundles/redoc.standalone.js"> </script>
  <script>
    fetch('http://petstore.swagger.io/v2/swagger.json')
      .then(res => res.json())
      .then(spec => {
        spec.info['x-logo'] = { url: "link/to/image.png" };
        Redoc.init(spec, {
        // options go here (e.g. pathInMiddlePanel)
        }, document.getElementById('redoc'));
      });
</body>

注意： 这需要 Fetch API 在浏览器中可用，因此它在 IE11 中不起作用。

Answer 2

您只需将选项放在 redoc 标签中的 spec-url 之后，如下所示：

<body>
    <redoc spec-url='http://petstore.swagger.io/v2/swagger.json' YOUR_OPTIONS_HERE></redoc>
    <script src="https://cdn.jsdelivr.net/npm/redoc@next/bundles/redoc.standalone.js"> </script>
</body>

在 ReDoc 存储库上的这个示例中，您可以验证它（此时第 22 行）：

https://github.com/Rebilly/ReDoc/blob/master/config/docker/index.tpl.html#L22

重要：

记住 "kebab-casing ReDoc 选项"，例如，如果您的选项是：

hideDownloadButton noAutoAuth disableSearch

YOUR_OPTIONS_HERE

应该是（在 kebab-casing 他们之后）：

hide-download-button no-auto-auth disable-search

带有这些选项的 body 变成这样：

<body>
    <redoc spec-url='http://petstore.swagger.io/v2/swagger.json' hide-download-button no-auto-auth disable-search></redoc>
    <script src="https://cdn.jsdelivr.net/npm/redoc@next/bundles/redoc.standalone.js"> </script>
</body>

希望对你有用。

Answer 3

您可以将选项放在 spec-url 旁边。确保你正在使用的 Redoc 版本，有你想要使用的选项，你可以通过转到特定版本来检查它。 github.com/Redocly/redoc/tree/vx.x.x。作为旁注，延迟渲染功能在 v1.22.3.

之前可用

https://github.com/Redocly/redoc#redoc-options-object

You can use all of the following options with standalone version on tag by kebab-casing them, e.g. scrollYOffset becomes scroll-y-offset and expandResponses becomes expand-responses.

如何在<redoc>中添加选项？

How to add option in <redoc>?

documentation

asp.net-mvc

swagger

重要：