1. 程式人生 > >將前端程式碼佈置到伺服器端後找不到靜態資源

將前端程式碼佈置到伺服器端後找不到靜態資源

將前端頁面程式碼佈置到伺服器SpringMVC後,經常出現靜態資源找不到的問題。
首先,應該設定springMVC,使其不要攔截靜態資源。在springMVC的配置檔案中新增如下程式碼:

<mvc:annotation-driven />
<mvc:resources location="/image/" mapping="/image/**"/>
<mvc:resources location="/css/" mapping="/css/**"/>
<mvc:resources location="/js/" mapping="/js/**"/>

這時,靜態檔案就可以被訪問了。但是有時候會出現如下所示的錯誤:

在eclipse中顯示的錯誤提示資訊

在瀏覽器端看到效果就是部分資源無法訪問,如下圖,標號2處的小圖片沒有正常顯示,按F12,在控制檯中可以得到錯誤提示資訊,如圖:

瀏覽器端的錯誤資訊提示

錯誤資訊的意思是:通過給定的URI不能訪問到相應的資源。
注意到訪問路徑http://localhost:8080/orderlist/images/pro_img/green_one.jpg 中多了/orderlist/這一層,如果在位址列中去掉/orderlist/後就可以訪問到該資源,如下圖:

這裡寫圖片描述

所以,很顯然問題就出在訪問路徑上。

開啟Controller檔案,可以看到@Controller下面的@RequestMapping(“/orderlist”),如圖:

Controller程式碼

問題就出在這裡,由於這裡設定了路徑,所以頁面跳轉或者獲取資源的時候路徑裡都帶有/orderlist/,干擾了靜態資源的獲取,將@Controller下的@RequestMapping(“/orderlist”)改為@RequestMapping(“/”),這個時候訪問路徑就能正常獲得資源了。

正確顯示

本文中用到的頁面程式碼來自《鋒利的jQuery》,謝謝該書作者的分享。