1 现象
404、或者没有加载样式或者图片等静态资源
静态资源引入失败,在浏览器按住F12,看一下静态资源路径地址,发现
地址 : http://localhost:8080/myproject/css/my.css
疑惑:这看上去没啥问题呀?
2 原因
原本在springboot内置Tomcat中运行项目,资源访问路径URL类似于:http://localhost:8080/css/my.min.css
是不是发现多了个项目名称?
咋办?把前台资源路径该一下可以吗
http://localhost:8080 拼 /css/my.min.css
这样可以看起来搞成功
但是如果项目使用的是Https的或者项目端口改了,是不是就跪了。有办法解决
3 解决
使用拦截器
在Java后端定义一个拦截器,用来获取 request.getContextPath() 然后传到前端,request.getContextPath() 得到的是项目的根路径
获取的路径是动态的,即使协议、端口号、项目名改了,静态资源依然能找到
@Component
public class CommonIntercepter implements HandlerInterceptor {
private final Logger logger = LoggerFactory.getLogger(this.getClass());
@Override
public boolean preHandle(HttpServletRequest request,HttpServletResponse response, Object handler) throws Exception {
return true;
}
@Override
public void postHandle(HttpServletRequest request,HttpServletResponse response, Object handler,ModelAndView modelAndView) throws Exception {
request.setAttribute("path", request.getContextPath());
}
@Override
public void afterCompletion(HttpServletRequest request,HttpServletResponse response, Object handler, Exception ex)throws Exception {
}
}
前端 (freemarker)
<link href="${path!}/css/bootstrap.min.css" rel="stylesheet">
<link href="${path!}/css/font-awesome.min.css" rel="stylesheet">
<link href="${path!}/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
<link href="${path!}/css/animate.css" rel="stylesheet">
<link href="${path!}/css/style.css" rel="stylesheet">
这样在浏览器请求资源时候是前缀就可以动态获取了