IntelliJ IDEA+SpringBoot中靜態資源訪問路徑陷阱：靜態資源訪問404

<h1>
    <span class="link_title"><a href="/zhoucheng05_13/article/details/78197766">
    IntelliJ IDEA+SpringBoot中靜態資源訪問路徑陷阱：靜態資源訪問404        
       
    </a>
    </span>

     
</h1>

<div class="article_manage clearfix">
   
    
</div>    <style type="text/css">        
        .embody{
            padding:10px 10px 10px;
            margin:0 -20px;
            border-bottom:solid 1px #ededed;                
        }
        .embody_b{
            margin:0 ;
            padding:10px 0;
        }
        .embody .embody_t,.embody .embody_c{
            display: inline-block;
            margin-right:10px;
        }
        .embody_t{
            font-size: 12px;
            color:#999;
        }
        .embody_c{
            font-size: 12px;
        }
        .embody_c img,.embody_c em{
            display: inline-block;
            vertical-align: middle;               
        }
         .embody_c img{               
            width:30px;
            height:30px;
        }
        .embody_c em{
            margin: 0 20px 0 10px;
            color:#333;
            font-style: normal;
        }
</style>
<script type="text/javascript">
    $(function () {
        try
        {
            var lib = eval("("+$("#lib").attr("value")+")");
            var html = "";
            if (lib.err == 0) {
                $.each(lib.data, function (i) {
                    var obj = lib.data[i];
                    //html += '<img src="' + obj.logo + '"/>' + obj.name + "&nbsp;&nbsp;";
                    html += ' <a href="' + obj.url + '" target="_blank">';
                    html += ' <img src="' + obj.logo + '">';
                    html += ' <em><b>' + obj.name + '</b></em>';
                    html += ' </a>';
                });
                if (html != "") {
                    setTimeout(function () {
                        $("#lib").html(html);                      
                        $("#embody").show();
                    }, 100);
                }
            }      
        } catch (err)
        { }
        
    });
</script>

今天在使用SpringBoot時遇到靜態資源無法訪問的問題，百思不得其解，最終解決，記錄下來。

問題描述

html頁面中訪問static文件夾下的index.css文件失敗，瀏覽器調試模式下發現404。
項目目錄結構如下：

---

HTML代碼截圖

路徑正常，可以通過ctrl+鼠標左鍵直接訪問。

---

但是當運行應用后，瀏覽器訪問時卻發現無法獲取文件，，F12打開開發者調試工具查看結果如下：

百思不得其解。於是各種百度，最終在一篇講解SpringBoot靜態資源訪問的博客中收到了啟發，解決了問題。

解決方案

那篇博客中寫道：

在SpringBoot中，默認配置的/**映射到/static。
靜態資源映射還有一個配置選項，為了簡單這里用.properties方式書寫：

spring.mvc.static-path-pattern=/** # Path pattern used for static
resources.

這個配置會影響默認的/**，例如修改為/static/**后，只能映射如/static/js/sample.js這樣的請求（修改前是/js/sample.js）。這個配置只能寫一個值，不像大多數可以配置多個用逗號隔開的。

這句“（修改前是/js/sample.js）”給了我啟發，於是我也將我的路徑去掉前面的“/static”，測試，成功！
修改后HTML頁面代碼截圖：

注意！這時IDEA高亮顯示，表示IDEA找不到該路徑！

---

運行結果截圖：

此時獲取index.css文件成功！並且路徑是”/css/index.css”！

即,解決方案是：去掉路徑前的“/static”!

總結

這次出錯的原因主要在於自己對SpringBoot的靜態資源映射不夠了解。不過，之所以記錄下這個問題，並分享給大家，有兩點原因：

1. 是因為在這個錯誤中IntelliJ IDEA起了助紂為虐的作用，錯誤的路徑它顯示為正確，而正確的路徑它卻高亮顯示找不到，這個坑可能會誤導很多人。
2. 是因為SpringMVC中正確的路徑是要加上“/static”的，之前用SpringMVC寫項目時一直這么用的，存在定勢思維。

關於SpringBoot的路徑說明可以參考這篇博客：http://blog.csdn.net/catoop/article/details/50501706

<script type="text/javascript">
    function btndigga() {
        $(".csdn-tracking-statistics[data-mod='popu_222'] a").click();
    }
    function btnburya() {
        $(".csdn-tracking-statistics[data-mod='popu_223'] a").click();
    }
        </script>



<div style="clear:both; height:10px;"></div>

2017-01-24更新

這個問題這次碰上的情況是自己在寫靜態資源位置的時候配置了多個，其實默認只要配置一個就好了，可以向上面那樣配置(直接配置/**)，可以用下面的配置：

resources: # 指定靜態資源的路徑</br>
    static-locations: classpath:/static/</br>
  使用的時候不用加static路徑即可