Creating SwaggerUI with pre existing swagger.json document
I have already created a swagger.json from an open-source library since my API doesn't support creating one due to HAPI-link and libraries. Now what I do is copy the JSON and load into an online Swagger-editor to verify and view the UI but is there any way by which I can feed the swagger JSON and create a SwaggerUI?
Allow your swagger.json file to be servable as static asset via your HAPI.js server. Let's say your server runs on https://pre-existing-swagger.com/ and your swagger.json file is accesible on https://pre-existing-swagger.com/static/swagger.json. Then create a following HTML file called api.html and again make it servable as static asset via your HAPI.js server. Now when you access https://pre-existing-swagger.com/static/api.html, SwaggerUI will render the swagger.json file.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>My Api</title>
<link rel="stylesheet" href="//unpkg.com/swagger-ui-dist@3.26.0/swagger-ui.css" />
<script src="//unpkg.com/swagger-ui-dist@3.26.0/swagger-ui-bundle.js"></script>
</head>
<body>
<div id="root" class="swagger-ui" />
<script>
const ui = SwaggerUIBundle({
url: 'https://pre-existing-swagger.com/static/swagger.json',
dom_id: '#root'
});
</script>
</body>
</html>
