Vert.X（Java）环境下Swagger UI无法加载问题咨询

问题背景 #

已将Swagger UI官方仓库dist目录下的所有文件复制到项目resources/webroot目录，配置静态资源路由如下：

router.route("/doc/*").handler(StaticHandler.create().setCachingEnabled(false).setWebRoot("webroot"));

但在Chrome中打开Swagger UI时页面空白，控制台出现3个资源404错误（swagger-ui-bundle.js、swagger-ui.css、swagger-ui-standalone-preset.js无法加载）。

核心原因 #

Swagger UI的index.html中资源引用为相对路径，当通过/doc/路径访问页面时，浏览器会从网站根目录（而非/doc/下）请求这些资源，导致静态处理器无法匹配到正确的文件路径。

解决办法 #

办法1：修改index.html的资源引用路径 #

打开webroot/index.html，给所有资源引用添加/doc/前缀：

<!-- 修改前 -->
<link rel="stylesheet" type="text/css" href="./swagger-ui.css" />
<script src="./swagger-ui-bundle.js"></script>
<script src="./swagger-ui-standalone-preset.js"></script>

<!-- 修改后 -->
<link rel="stylesheet" type="text/css" href="/doc/swagger-ui.css" />
<script src="/doc/swagger-ui-bundle.js"></script>
<script src="/doc/swagger-ui-standalone-preset.js"></script>

办法2：调整静态路由配置（推荐） #

确保静态处理器正确映射/doc/路径到webroot，同时设置默认首页，避免手动访问index.html：

router.route("/doc/*").handler(StaticHandler.create()
    .setWebRoot("webroot")
    .setCachingEnabled(false)
    .setIndexPage("index.html"));

// 可选：添加重定向，让访问/doc自动跳转到/doc/index.html
router.route("/doc").handler(ctx -> ctx.redirect("/doc/index.html"));

额外检查 #

确认resources/webroot目录下确实存在所有dist里的文件，包括上述报错的js和css文件，避免复制遗漏。

内容的提问来源于stack exchange，提问作者Soumak Poddar