目录
问题描述
我新建了一个H5网页,其目录结构如下:
H5内对资源的部分引用如下:
而且我也使用了thymeleaf
在本地访问,debug完全没有问题:
但是部署在tomcat上后出现访问不到图片和css资源的情况,页面布局混乱!
解决办法
很明显,这是一个资源路径找不到的问题,我的解决方案是这样的:
1. 找到你的tomcat配置文件 server.xml
配置上如下内容:
这里的含义很明显,即当你的H5在方位例如 /images/ 的路径时,指定其路径为/****/
对照:
其中app_server是我的放在***/webapp/下的war包
我这里使用的是相对路径,也可以使用绝对路径.
appBase的默认根目录就是***/webapp/
补充:===================================================================
在编程时就可以解决上述问题,你只需要这个,配置好静态资源路径映射即可(注意放在com包下):
package com.kuqi;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurationSupport;
@Configuration
public class InterceptorConfig extends WebMvcConfigurationSupport {
@Override
protected void addResourceHandlers(ResourceHandlerRegistry registry) {
// 静态资源映射
registry.addResourceHandler("/app/audio/**").addResourceLocations("classpath:/static/audio/");
registry.addResourceHandler("/app/css/**").addResourceLocations("classpath:/static/css/");
registry.addResourceHandler("/app/data/**").addResourceLocations("classpath:/static/data/");
registry.addResourceHandler("/app/effects/**").addResourceLocations("classpath:/static/effects/");
registry.addResourceHandler("/app/flash/**").addResourceLocations("classpath:/static/flash/");
registry.addResourceHandler("/app/fonts/**").addResourceLocations("classpath:/static/fonts/");
registry.addResourceHandler("/app/icon/**").addResourceLocations("classpath:/static/icon/");
registry.addResourceHandler("/app/images/**").addResourceLocations("classpath:/static/images/");
registry.addResourceHandler("/app/img/**").addResourceLocations("classpath:/static/img/");
registry.addResourceHandler("/app/js/**").addResourceLocations("classpath:/static/js/");
// registry.addResourceHandler("/app/**").addResourceLocations("classpath:/static/");
// registry.addResourceHandler("/app/js/**").addResourceLocations("classpath:/static/js/");
// System.out.println("已经注册了handle");
}
}