Question

我正在尝试修改具有servlet（RootResource.java）的Jetty服务器，以某种方式神奇地拾取并使用了它：

@Singleton
@Path("/")
public class RootResource {
    @Context
    private ServletContext servletContext;

    @GET
    @Path("react-client/{path: .*\\..+$}")
    public Response serveReactClientContent(@Context HttpServletRequest httpServletRequest) {
        // This doesn't work, a resolved relative resource is not relative
        // to the /react-client base. See description of problem.
        final String pathToResource = httpServletRequest.getRequestURI();
        return serveStaticContent(pathToResource);
    }

    @GET
    @Path("react-client/{path: .*$}")
    public Response serveReactClientIndexPage(@Context HttpServletRequest httpServletRequest) {
        return serveStaticContent("/react-client/index.html");
    }

    private Response serveStaticContent(String pathToResource) {
        final String type = this.servletContext.getMimeType(pathToResource);
        final Response.ResponseBuilder response = Response.ok(servletContext.getResourceAsStream(pathToResource)).type(type);
        return response.build();
    }
}

这个想法是向react-client/some/path发出GET请求并返回react-client/index.html的内容。本质上，使Jetty像使用客户端路由的webapp服务器一样运作。

我遇到的问题是index.html 中的相对路径仅在路径深一层时有效。 react-client/products。

<script src="./webapp.js"></script>

在那种情况下，因为webapp.js是react-client/webapp.js上的文件，所以在index.html中找到了上面的javascript文件。

当我尝试更深层次的链接时，例如react-client/products/97357361失败，因为servlet试图在不存在的webapp.js中找到react-client/products/webapp.js。

如何使它始终像从/react-client一样请求资源？谢谢

Answer 1

我尝试了很多操作，例如过滤器和rewrite handlers，但是Jetty从来没有提供过原始的未解决的相对导入（例如./webapp），所以我再也没有机会重写相关资源。

最后，我不得不通过黑客的手段检测到它们，因为他们几乎都是从/static/子目录中请求它们的（我必须为favicon.ico和{添加一个硬编码的异常{1}}。

manifest.json

对此不满意，但是可以使用。

Answer 2

由于您的index.html可以通过多个URL（例如

）进行访问

/ react-client / products
/ react-client / products / 97357361
/ react-client / some
/ react-client / some / path

明智的做法是在HTML页面的标题处添加一个<base>标签。

<head>
    ...
    <base href="https://www.yourwebsite.com/react-content/" />
    <script src="./script.js"></script>
    ...
</head>

这将告诉浏览器解析页面中相对于https://www.yourwebsite.com/react-content/的相对路径

因此，根据上面的示例，<script src="./script.js"></script>将以"https://www.yourwebsite.com/react-content/script.js"的形式请求到服务器，而不管当前用于访问该页面的URL是什么。

然后，您可以在Jetty上恢复这些设置并保持简单。

修复Java Servlet服务的HTML中的相对路径（对于HTML5 pushstate）

2 个答案: