aiohttp-swagger icon indicating copy to clipboard operation
aiohttp-swagger copied to clipboard

How to add content to the index.html file?

Open rafa-acioly opened this issue 5 years ago • 0 comments

I'm trying to add new content to the script so i can decide if i want to show the endpoint list or not but i seems that there's no easy way unless i use regex.


setup_swagger(
        app,
        swagger_url='/docs',
        swagger_from_file="docs/swagger.yaml",
        swagger_home_decor=_home_decor,
        ui_version=3
    )

setup_swagger_ui(app)

def setup_swagger_ui(app):
    html_path = abspath(join(dirname(__file__), "../docs/swagger.html"))
    with open(html_path) as f:

        # This key does not have my "##SHOW_ENDPOINTS##" tag
        # because it was read from the package itself.
        # and i cannot override it because my template does not have the ##STATIC_PATH##
        # that the package replaced on the setup_swagger method.
        app["SWAGGER_TEMPLATE_CONTENT"] = (
            f.read().replace('##SHOW_ENDPOINTS##', 'false')
        )

The only way i can imagine is to use regex to add my conditions, maybe grep by window.ui and change it to add my condition

<!-- my template -->
<!-- ... -->
<script>
    window.onload = function() {
      // Begin Swagger UI call region
      const ui = SwaggerUIBundle({
        url: "##SWAGGER_CONFIG##",
        dom_id: '#swagger-ui',
        deepLinking: true,
        presets: [
          SwaggerUIBundle.presets.apis,
          SwaggerUIStandalonePreset
        ],
        plugins: [
          SwaggerUIBundle.plugins.DownloadUrl
        ],
        layout: "StandaloneLayout"
      })
      // End Swagger UI call region

      // const showEndpoint = eval('##SHOW_ENDPOINTS##')
     // if (!showEndpoint) { document.querySelector(".wrapper").addClass('is-hidden')

      window.ui = ui
    }
</script>
<!-- ... -->

Possible solution

  1. Adds a parameter on the setup_swagger to define the path to the html file This way we can set all "configs" to the user file and let them replace their own.

  2. Adds a parameter on the setup_swagger so the user can pass a "component" to be injected on the html. e.g:

<!-- index.html file on the package -->
<script>
    window.onload = function() {
        // ... 
    }
 
      window.ui = ui
    }
  </script>
  ##CUSTOM_COMPONENT##
def setup_swagger(app, html_component=None, ...):
        # ...
        with open(join(STATIC_PATH, "index.html"), "r") as f:
        app["SWAGGER_TEMPLATE_CONTENT"] = (
            f.read()
            .replace("##SWAGGER_CONFIG##", '{}{}'.
                     format(api_base_url.rstrip('/'), _swagger_def_url))
            .replace("##STATIC_PATH##", '{}{}'.
                     format(api_base_url.rstrip('/'), statics_path))
            .replace("##SWAGGER_VALIDATOR_URL##", swagger_validator_url)
            .replace("##CUSTOM_COMPONENT##", html_component)
        )

Usage:

<!-- my component -->
<script>console.log('hello custom component')</script>
my_custom_component = '/files/component.html'
setup_swagger(app, html_component=my_custom_component)

rafa-acioly avatar May 28 '20 20:05 rafa-acioly