背景：

想通过纯jsp或html文件去构建一个前端项目工程，使用idea自动生成文件目录，使用maven管理。所有文件都在webapp目录下，设计完jsp页面后，通过mvn package命令进行打包，然后运行访问。问题来了，页面有使用到css、图片文件，引用的路径没有问题，但是浏览器总是提示404，所以我们来探究下这个问题。

分析：

首先我们的服务是在tomcat容器下部署的，所以这个问题先从tomcat说起

• 文件目录的权限问题：知道我们打包完的数据都在war包的WEB-INF目录下

WEB-INF是Java的WEB应用的安全目录。所谓安全就是客户端无法访问，只有服务端可以访问的目录

• 那么我们可以把文件移动到WEB-INF目录同级的地方 

jsp中以下链接：

<link rel="stylesheet" type="text/css" href="WEB-INF/js/jstatic/scss/custom-common.css">

修改后的代码：

<link rel="stylesheet" type="text/css" href="js/static/scss/custom-common.css">

 启动服务然后访问，发现可以了，所以到这问题就暂时解决了。但是这还有一个问题，就是我们再修改web.xml文件来进行url管理时，还会出现静态文件引用报404错误。问什么呢？

文件在WEN_INF内和在WEN_INF外的引用方式除了路径不一样的外，实质内容是服务器
安全内容只有内部可以访问，但是我们平常开发的web工程是使用spring mvc或其他mvc
框架来通过DispatcherServlet类来控制的：

    <servlet>
        <servlet-name>chapter2</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>chapter2</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>


而普通的web工程是没有调度器的，所以我们可以通过web.xml文件来修改：

     <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.css</url-pattern>
      </servlet-mapping>
      <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.gif</url-pattern>
      </servlet-mapping>

备注：关于项目下的web.xml和tomcat下的web.xml文件的关系，这里就不说了。

 <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.css</url-pattern>
      </servlet-mapping>
      <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.gif</url-pattern>
      </servlet-mapping>

这块内容是告诉tomcat对应的url可以被内部servlet容器所处理，并且能映射到对应的目录文件，这里有引发一个问题就是tomcat挂载静态文件的方式，还有另一种方式就是server.xml文件中添加一个docbase的配置项，其实这两种方式的效果一致。 

总结：

1.需要多了解web工程各个文件目录的含义

2.熟悉tomcat加载文件及url映射的机制

3.如何使用tomcat、nginx去挂载静态文件