Swagger 漂亮的 HTML 代码在哪里？

Question

只有丑陋的HTML 页面可供下载（HTML、HTML2 和动态都丑陋），但是该网站，例如。编辑https://app.swaggerhub.com/apis/{user}/{project}/{version} （和许多其他！）提供漂亮的 HTML 界面...如何下载这个漂亮的 HTML？

完整且自主的 HTML 代码（文件或文件压缩包）。

我有一个良好且有效的swagger.yamlAPIswagger.json文件，因此另一个解决方案是使用我的 API 描述文件运行开源（即插即用！）工具。

---

漂亮的：

丑陋的：

Answer 1

屏幕截图上的“漂亮界面”是Swagger UI。它是免费且开源的。http://petstore.swagger.io上有一个演示，您可以在其中从 URL 加载您自己的 YAML/JSON 文件并查看它们的呈现方式。

要在本地使用 Swagger UI：

1. 转到https://github.com/swagger-api/swagger-ui并将存储库下载为 ZIP：

   

2. 编辑dist\index.html文件并更改行

   url: "http://petstore.swagger.io/v2/swagger.json",
   

   到 Swagger .json 或 .yaml 文件的 URL，例如

   url: "http://api.mysite.com/swagger.json",
   

3. （可选）在初始化代码中添加/更改其他配置参数。SwaggerUIBundledist\index.html

4. 在浏览器中打开dist\index.html文件以预览 API 文档。

   注意：如果规范未加载或“尝试一下”不起作用，您可能需要在服务器上启用 CORS。请参阅https://github.com/swagger-api/swagger-ui/blob/master/docs/usage/cors.md和https://enable-cors.org。

5. 将文件从dist某个文件夹上传到您的服务器 - 现在您也有了漂亮的 API 文档！

或者，SwaggerHub（您提到的）为 Swagger 规范提供云托管等，并集成了 Swagger UI。您可以在那里导入 Swagger .json/.yaml 文件，并将 API 文档托管在 SwaggerHub 上。提供免费计划。

Answer 2

现代 Swagger-UI https://github.com/swagger-api在自述文件中说

如果您正在寻找普通的 HTML/JS/CSS，请下载最新版本并将该文件夹的内容复制/dist到您的服务器。

要在那里安装 OpenAPI JSON，请更改此行的 URLswagger-initializer.js，

    url: "MY_URL", //"https://petstore.swagger.io/v2/swagger.json",

旧答案

感谢swagger-ui/issues 的 @tleyden 提供的好线索！

assets使用该项目的索引和文件夹， https://github.com/okfn-brasil/swagger-ui-html