强势解决“上传图片后不显示”，撂倒404错误，数据上传So easy！

2023-08-07 19:56:59

Spring MVC + LayUI 开发中解决图片无法显示的疑难杂症

子标题 1：问题溯源——静态资源配置失误

当你满怀信心地使用 Spring MVC 结合 LayUI 框架搭建 JSP 页面时，却发现图片总是无情地拒绝现身，控制台更是毫不留情地抛出 404 错误。这令人抓狂的故障背后，往往潜藏着 Spring MVC 中静态资源配置的失误。

子标题 2：配置 web.xml，让默认 servlet 接管静态资源请求

第一步，让我们在 web.xml 中为静态资源请求配置一条明确的道路。在 web.xml 文件中，找到如下代码：

<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>/</url-pattern>
</servlet-mapping>

这条配置仿佛一个指示牌，将以斜杠（/）开头的所有请求导向默认 servlet。而默认 servlet 就像一个勤劳的管家，它会殷勤地检索并加载静态资源文件，让它们乖乖出现在浏览器中。

子标题 3：配置拦截器，让 Spring MVC 参与静态资源拦截

为了让 Spring MVC 积极参与静态资源拦截的盛会，我们需要在 Spring MVC 配置文件中引入一个拦截器。在配置文件中，添加如下配置：

<mvc:interceptors>
    <mvc:interceptor>
        <mvc:mapping path="/js/**" />
        <mvc:mapping path="/css/**" />
        <mvc:mapping path="/img/**" />
    </mvc:interceptor>
</mvc:interceptors>

这段配置就像一张邀请函，邀请 Spring MVC 拦截所有以 /js/、/css/ 和 /img/ 开头的请求。这样一来，Spring MVC 就可以对这些静态资源请求进行进一步的处理。

子标题 4：拦截器中配置路径，指定静态资源的藏身之处

在拦截器中，我们需要明确指定静态资源的藏身之处。在拦截器的 resolveResource 方法中，添加如下配置：

@Override
public Resource[] resolveResource(HttpServletRequest request, String requestPath) throws IOException {
    if (requestPath.startsWith("/js/")) {
        return new Resource[]{new ClassPathResource("/static/js/" + requestPath.substring("/js/".length()))};
    } else if (requestPath.startsWith("/css/")) {
        return new Resource[]{new ClassPathResource("/static/css/" + requestPath.substring("/css/".length()))};
    } else if (requestPath.startsWith("/img/")) {
        return new Resource[]{new ClassPathResource("/static/img/" + requestPath.substring("/img/".length()))};
    }
    return null;
}