如何将 Swagger UI 嵌入网页？基本上我想要一个 API 端点测试环境嵌入到我的网页中。
答案取决于您是否有直接编辑的纯网页，或者使用 Node.js 或 React 等框架。为了简单起见，我假设是前者。
下载（或克隆）Swagger UI 存储库。您需要
distswagger-ui.css
swagger-ui-bundle.js
swagger-ui-standalone-preset.js
在网页的
<head><link rel="stylesheet" type="text/css" href="swagger-ui.css">
在
<body><div id="swagger-ui"></div>
<script src="swagger-ui-bundle.js"></script>
<script src="swagger-ui-standalone-preset.js"></script>
<script>
window.onload = function() {
const ui = SwaggerUIBundle({
url: "https://yourserver.com/path/to/swagger.json",
dom_id: '#swagger-ui',
presets: [
SwaggerUIBundle.presets.apis,
SwaggerUIStandalonePreset
]
})
window.ui = ui
}
</script>
<div id="swagger-ui"></div>SwaggerUIBundle