Hugo Docsy SwaggerUI 短代码不呈现规格文件

问题描述

我正在尝试使用 Hugo Docsy SwaggerUI Shortcode 呈现 OAS 文件，但呈现的页面不包含预期结果。

这是我的 rest-api.md 文件：

---
title: "REST API"
linkTitle: "REST API"
date: 2021-02-21
weight: 2
description: >
  REST API described using OpenAPI Specification.
---

{{< swaggerui src="http://localhost:1313/access.yaml" >}}

这是渲染的页面：

如您所见，HTML 包含以下尝试呈现 OAS 文件的脚本：

  var resolveUrl = function () {
    var passedUrl = 'http:\/\/localhost:1313\/access.yaml';
    var baseUrl = '\/\/localhost:1313\/'.replace(/\/$/,'');
    if (passedUrl.startsWith('/')) {
      return baseUrl + passedUrl;
    }
    return passedUrl;
  };
  window.onload = function () {
    const ui = SwaggerUIBundle({
      url: resolveUrl(),dom_id: '#ohpen_swagger_ui',presets: [
        SwaggerUIBundle.presets.apis,SwaggerUIStandalonePreset
      ]
    });
    window.ui = ui;
  };

需要注意的是，http://localhost:1313/access.yaml 成功解析为 access.yaml 文件。

是什么阻止了 OAS 文件的呈现？

解决方法

我发现了我的错误。 type 必须在页面的首页设置为 swagger。

页面必须如下：

---
title: "REST API"
linkTitle: "REST API"
type: swagger
date: 2021-02-21
weight: 2
description: >
  REST API described using OpenAPI Specification.
---

{{< swaggerui src="http://localhost:1313/access.yaml" >}}

OAS 文件可以使用相对路径 /access.yaml 引用，以防 Hugo 作为静态文件提供。