DODS page cannot access CSS and JS

[fz-gaojian]

First Check

• I added a very descriptive title to this issue.
• I used the GitHub search to find a similar issue and didn't find it.
• I searched the FastAPI documentation, with the integrated search.
• I already searched in Google "How to X in FastAPI" and didn't find any information.
• I already read and followed all the tutorial in the docs and didn't find an answer.
• I already checked if it is not related to FastAPI but to Pydantic.
• I already checked if it is not related to FastAPI but to Swagger UI.
• I already checked if it is not related to FastAPI but to ReDoc.

Commit to Help

• I commit to help with one of those options 👆

Example Code

from fastapi import FastAPI

app = FastAPI()

@app.get("/")
def read_root():
    return {"Hello": "World"}

Description

Request URL: https://cdn.jsdelivr.net/npm/swagger-ui-dist@3/swagger-ui.css
Request URL: https://cdn.jsdelivr.net/npm/swagger-ui-dist@3/swagger-ui-bundle.js
Because the above two resources cannot be accessed, there is no display in the DOCS page.

Operating System

Linux

Operating System Details

No response

FastAPI Version

fastapi==0.54.1

Python Version

python 3.7.3

Additional Context

No response

[SangYuming]

My solution is to download Swagger-ui, which must include favicon.png、swagger-ui.css、swagger-ui-bundle.js，Then create a new static folder

Provides static file services：

from fastapi import applications
from fastapi.staticfiles import StaticFiles
from fastapi.openapi.docs import get_swagger_ui_html

app.mount("/static", StaticFiles(directory="./static"), name="static")
def swagger_monkey_patch(*args, **kwargs):
    return get_swagger_ui_html(
        *args,
        **kwargs,
        swagger_js_url="/static/swagger-ui/swagger-ui-bundle.js",
        swagger_css_url="/static/swagger-ui/swagger-ui.css",
        swagger_favicon_url="/static/swagger-ui/favicon.png"
    )
applications.get_swagger_ui_html = swagger_monkey_patch

[YuriiMotov]

Docs on this: https://fastapi.tiangolo.com/how-to/custom-docs-ui-assets/

[liushuangdan]

Perhaps downloading Swagger-UI files will solve this problem.
I did like that。My API documentation worked。

if static_root:
    app.mount('/static', StaticFiles(directory=static_root), name='static')
else:
    app.mount('/static', StaticFiles(directory=f"{root}/src/static"), name='static')


def swagger_monkey_patch(*args, **kwargs):
    """
    Wrap the function which is generating the HTML for the /docs endpoint and
    overwrite the default values for the swagger js and css.
    """
    return get_swagger_ui_html(
        *args, **kwargs,
        swagger_js_url="/static/dist/swagger-ui-bundle.js",
        swagger_css_url="/static/dist/swagger-ui.css")


# Actual monkey patch
applications.get_swagger_ui_html = swagger_monkey_patch

[fz-gaojian]

It is normal now, thank you