Html 当使用SpringMVC'；s@PathVariable_Html_Css_Spring Mvc_Thymeleaf

Html 当使用SpringMVC'；s@PathVariable

html css spring-mvc

Html 当使用SpringMVC'；s@PathVariable,html,css,spring-mvc,thymeleaf,Html,Css,Spring Mvc,Thymeleaf,不知何故，我的CSS文件没有包含在我的ThymileAF模板中首先，我需要解释工作流程：用户单击表单提交将帖子发送到/historyDetails/{history\u id} 一些数据将使用历史记录id从数据库中获取数据将呈现在history-detail-view.html上这是我的DispatcherServlet： @Configuration @EnableWebMvc @ComponentScan("*") public class DispatcherServlet ext

不知何故，我的CSS文件没有包含在我的ThymileAF模板中

首先，我需要解释工作流程：

用户单击表单提交将帖子发送到/historyDetails/{history\u id}

一些数据将使用历史记录id从数据库中获取

数据将呈现在history-detail-view.html上

这是我的DispatcherServlet：

@Configuration
@EnableWebMvc
@ComponentScan("*")
public class DispatcherServlet extends WebMvcConfigurerAdapter {
    @Autowired
    private WebApplicationContext ctx;

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        /*
         * resolve path to static ressources (images, stylesheets, javascript-files)
         */
        registry.addResourceHandler("img/**").addResourceLocations("/WEB-INF/static/img/");
        registry.addResourceHandler("css/**").addResourceLocations("/WEB-INF/static/css/");
        registry.addResourceHandler("js/**").addResourceLocations("/WEB-INF/static/js/");
    }

    @Bean
    public ThymeleafViewResolver getViewResolver() {
        ThymeleafViewResolver vr = new ThymeleafViewResolver();

        vr.setTemplateEngine(getTemplateEngine());

        return vr;
    }

    @Bean
    public SpringTemplateEngine getTemplateEngine() {
        SpringTemplateEngine te = new SpringTemplateEngine();

        te.setTemplateResolver(getTemplateResolver());
        te.setEnableSpringELCompiler(true);

        return te;
    }

    @Bean
    public SpringResourceTemplateResolver getTemplateResolver() {
        SpringResourceTemplateResolver tr = new SpringResourceTemplateResolver();

        tr.setApplicationContext(ctx);
        tr.setOrder(1);
        /*
         * resolve path to html to WEB-INF/<name>.html
         * 
         * name can be something like templates/xxx.html
         */
        tr.setPrefix("WEB-INF/");
        tr.setSuffix(".html");

        return tr;
    }
}

@配置
@EnableWebMvc
@组件扫描（“*”）
公共类DispatcherServlet扩展WebMVCConfigureAdapter{
@自动连线
私有WebApplicationContext ctx；
@凌驾
public void addResourceHandlers（ResourceHandlerRegistry注册表）{
/*
*解析静态资源（图像、样式表、javascript文件）的路径
*/
registry.addResourceHandler（“img/**”）.addResourceLocations（“/WEB-INF/static/img/”）；
registry.addResourceHandler（“css/**”）.addResourceLocations（“/WEB-INF/static/css/”）；
registry.addResourceHandler（“js/**”）.addResourceLocations（“/WEB-INF/static/js/”）；
}
@豆子
public-eleafviewsolver getviewsolver（）{
ThymileAfViewResolver vr=新的ThymileAfViewResolver（）；
setTemplateEngine（getTemplateEngine（））；
返回虚拟现实；
}
@豆子
公共SpringTemplateEngine getTemplateEngine（）{
SpringTemplateEngine te=新的SpringTemplateEngine（）；
setTemplateResolver（getTemplateResolver（））；
te.setEnableSpringELCompiler（true）；
返回te；
}
@豆子
公共SpringResourceTemplateResolver getTemplateResolver（）{
SpringResourceTemplaterResolver tr=新的SpringResourceTemplaterResolver（）；
tr.setApplicationContext（ctx）；
tr.setOrder（1）；
/*
*将html路径解析为WEB-INF/.html
* 
*名称可以类似于templates/xxx.html
*/
tr.setPrefix（“WEB-INF/”）；
tr.setSuffix（“.html”）；
返回tr；
}
}

我的项目结构（从根目录）：

这是htistory-detail-view.html：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>Insert title here</title>

        <link rel="stylesheet"
                type="text/css"
                th:href="@{css/style.css}"/>

        <script type="text/javascript"
                th:src="@{https://code.jquery.com/jquery-3.4.1.min.js}"></script>
        <script type="text/javascript"
                th:src="@{js/utilities.js}"></script>

    </head>

    <body>
        <div th:replace="fragments/grid :: grid(${grid}, 'HISTORY_DETAIL')"></div>
        <div th:replace="fragments/paging :: paging(${grid})"></div>
    </body>

    <div th:replace="fragments/general :: footer"></div>
</html>


在此处插入标题

虽然index.html是用css呈现的，但history-detail-view.html不是简单的html

我从firefox的“网络”选项卡中获取的唯一错误消息是：

Loading failed for the <script> with source “http://localhost:9080/MyProject/historyDetails/js/utilities.js”.

为具有源的加载失败”http://localhost:9080/MyProject/historyDetails/js/utilities.js”.

我之所以将DispatcherServlet放到这个线程中，是因为它负责解析到静态资源的路径。当比较projectstructure中的路径与errormessage中的路径时，DispatcherServlet似乎无法正常工作，但我不知道如何使其解析正确的路径

我在这里看到的唯一区别是Pathvariable

编辑：我提供了我的index.html，因为它在这里工作正常：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>Insert title here</title>

        <link rel="stylesheet"
                type="text/css"
                th:href="@{css/style.css}"/>

        <script type="text/javascript"
                th:src="@{https://code.jquery.com/jquery-3.4.1.min.js}"></script>
        <script type="text/javascript"
                th:src="@{js/utilities.js}"></script>

    </head>

    <body>
        <div th:replace="fragments/grid :: grid(${grid}, 'HISTORY')"></div>
        <div th:replace="fragments/paging :: paging(${grid})"></div>
    </body>

    <div th:replace="fragments/general :: footer"></div>
</html>


在此处插入标题

问题可能是因为spring安全配置（如果有的话）。将CSS静态文件的路径添加为spring安全配置中的异常

如果您没有使用spring安全性或提供了异常，请确保遵循标准文件夹结构

查看更多详细信息。

1。我没有提到任何关于spring security的内容，因此我没有使用它。我截屏了项目结构，这不是默认的，但这就是为什么我提供了DispatcherServlet 3。正如我在index.html中提到的，我的静态资源是可解析的，但在我的history-detail-view.html中不是，因为我看不出两者之间有任何区别（-section是相同的），我无法解释为什么它无法解析静态资源4。我没有提到这是一个springboot项目，它是一个JEE项目，因此我需要使用

“@{/js/utilities.js}

而不是

”@{js/utilities.js}

工作，在DispatcherServlet中映射到我的静态资源的链接。不，不幸的是，在我的DispatcherServlet中，/一开始就解决了（在my index.html中）