SSM之一步一坑：加载静态资源 js/css文件路径问题

在做SSM项目时，加载静态文件一直没有成功，其实问题也不大

问题描述

如下图片中的加载静态文件问题

在这一步问题出现中，我的项目目录如下图

HTML中对静态文件的引用如下

解决方案一，使用绝对路径

在HTML页面中对静态文件采用绝对路径进行引用，前提是SSM项目已经可以加载简单页面，在项目的web.xml，spring-mvc.xml中不需要配置其他东西。

将HTML页面中的引用静态文件的标签改为项目绝对路径

以引用css文件为例，

测试结果

绝对路径：http://[ip/localhost]:[端口]/[项目名]/[css路径]

如果仍然出现上述路径错误问题，请在浏览器中直接访问css绝对路径，查看是否能够访问.css文件

如下

如果无法访问，有可能是在web.xml中没有正常拦截.css，需要进行配置.css访问。

web.xml部分配置如下

<!-- SpringMVC配置 -->
	<servlet>
		<servlet-name>springDispatcherServlet</servlet-name>
		<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
		<init-param>
			<param-name>contextConfigLocation</param-name>
			<param-value>classpath:spring-mvc.xml</param-value>
		</init-param>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>springDispatcherServlet</servlet-name>
		<url-pattern>/</url-pattern>
	</servlet-mapping>
<!-- 正常拦截html,js,cssSpringMVC配置 激活 Tomcat 的 defaultServlet 来处理静态资源 
注意:/ 会匹配所有url，但不包括 * .jsp，* .html，* .js这样的文件这样的文件。也就是*.jsp不会进入Spring的DispatcherServlet 
-->
	<servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.css</url-pattern>
    </servlet-mapping>
 	<servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.js</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.png</url-pattern>
    </servlet-mapping>
 
    <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.jpg</url-pattern>
    </servlet-mapping>
 
    <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.gif</url-pattern>
    </servlet-mapping>
        <servlet-mapping> 
            <servlet-name>default</servlet-name> 
            <url-pattern>*.html</url-pattern> 
    </servlet-mapping>

	<welcome-file-list>
		<welcome-file>index.html</welcome-file>
		<welcome-file>index.jsp</welcome-file>
	</welcome-file-list>

解决方案二、相对路径

在spring-mvc.xml中加入 ，Spring 3.0.4 以后版本提供了 <mvc:resources /> 

<mvc:resources location="/static/" mapping="/static/**"></mvc:resources>
解释这段xml配置的含义：
location="/static/" 指定静态资源的位置，可以是 web application 根目录下、jar 包里面，这样可以把静态资源压缩到 jar 包中

 mapping="/static/**" 映射到 ResourceHttpRequestHandler 进行处理。

cache-period 可以使得静态资源进行 web cache。 

HTML文件

测试结果

关于静态资源访问可以参考更详细连接

https://my.oschina.net/hnqingping1255/blog/415575

 

注：

写在最后的一点，使用相对路径时，采用的是使用

激活 Tomcat 的 defaultServlet 来处理静态资源 ，即在上文中贴出的web.xml文件中的代码。

但是在进行相对路径访问静态资源时，发现即便不配置spring-mvc.xml的文件，在HTML中直接使用"../static/css/001.css"，也能完成对静态资源的访问，很是疑惑，如有参考到本博客的可以讨论下。。。。也有可能是上文写的绝对访问路径"、SongSSM/static/css/001.css"和静态访问路径"../static/css/001.css"意义相同，如有理解错误，希望看到的大佬给出指正。