Thymeleaf：直接访问页面时无法加载js和css答案

【问题标题】：Thymeleaf: can't load js and css when direct access the pageThymeleaf：直接访问页面时无法加载js和css
【发布时间】：2018-03-06 03:56:09
【问题描述】：

更新：更清楚地描述问题

我用spring boot和thymeleaf创建了一个网络应用程序，如果我打开登录页面，然后登录，然后依次前往管理模块或报告模块，一切正常。

当我在浏览器中键入 url locahost:8080/send/kf/index（需要进行身份验证，但我可以在自定义过滤器中打开对所有内容的访问权限）时发生问题，页面加载时没有 js 和 css。在调试模式下，我看到/send/kf 被意外放入如下路径。如果我访问localhost:8080/assets/avatars/avatar.png，我可以获得资源。

以下是我放置静态资源的文件夹结构。 /send/kf怎么会自动添加到url中，请帮我解决这个问题。谢谢！

【问题讨论】：

使用/assets/ 代替assets/ 能解决您的问题吗？
不，正确的路径应该是/assets/css/...，但是/send/kf会自动放入url中。
你使用spring-security吗？如果是的话，这可能会有所帮助。 resource 1, resource 2
@DavePateral ... 这就是使用 /assets/ 应该解决的问题，对吧？所以只需在您的网址开头添加正斜杠
@Patrick Yse，我使用弹簧安全，感谢您的指导，但问题不在于那个。打开登录页面可以加载资源，但是在浏览器中输入url(/send/kf/index)时加载不出来，需要加载这些资源，但是/send/kf却意外放入了路径

标签： spring-boot spring-security thymeleaf

【解决方案1】：

使用/assets/ 而不是assets/ 可以解决此问题，否则它是一个应该添加到现有网址末尾的相对网址。

【讨论】：

【解决方案2】：

我找到了这个问题的解决方案。我不知道/send/kf是如何放入静态资源的url中的，但是我想如果我把控制器映射放在根路径下，这个问题应该可以避免。我认为，url是正确的，资源可以成功加载。

@Controller
public class ManualMessageController {

    @Autowired
    private MsgTemplateRepository msgTemplateRepository;

    @RequestMapping("/manualMsg")
    public String manualMsg(Model model){
        model.addAttribute("msgTemplateList", msgTemplateRepository.findByStatus(1));
        return "manualMessage";
    }
}

更新：

正确的解决方案是在项目中使用绝对路径而不是相对路径。所以把assets/css改成/assets/css就可以了。

【讨论】：

【解决方案3】：

您可以在 application.properties 文件中使用 spring.resources.static-locations

spring.resources.static-locations=classpath:/resources/css/

spring.mvc.static-path-pattern=/resources/**

取自documentation

注意：静态资源，如 JavaScript 或 CSS，可以很容易地从 Spring Boot 应用程序中提供，只需将它们放到源代码中的正确位置即可。默认情况下，Spring Boot 从“/static”（或“/public”）的类路径中的资源中提供静态内容

【讨论】：

这是重定位静态资源的地址吧？我的js和css在resouces/static/assets下，登陆网站可以加载，但是直接点击内部url加载失败。
你的意思是你通过超链接访问这个页面吗？
不是超链接，在浏览器中输入url即可。