1.问题描述

前端页面上传图片，后端接收后保存，并修改前端页面引用的图片资源，虽然资源目录下的图片已经成功修改，但是前端显示的还是旧的页面，需要服务器重启才能刷新。

2.原因分析

1.缓存原因

可能是由于浏览器缓存了图片资源，再次刷新时不会重新请求图片。

2.其它

如果解决了缓存问题后依旧不能解决，可能是服务器的保护措施导致的，服务器不能对外部暴露真实的资源路径。

3.解决方法

1.解决缓存问题

在每次重新进入页面时给图片的url后添加一个随机数，让浏览器重新进行请求。

    <script>
    function f() {
    var img = document.getElementById("id");
    img.src = "/img/img.jpg"+"?"+Math.random()*10;
    }
	//之后在body标签上调用函数，οnlοad="f()"

2.配置虚拟路径映射访问

增加配置类

@Configuration
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
    	String path="D:\\Project\\src\\main\\resources\\static\\img\\";
        registry.addResourceHandler("/img/**").addResourceLocations("file:"+path);
    }
}