Không hiển thị hình ảnh trong Spring MVC

Question

Tôi biết câu hỏi này đã được hỏi nhiều lần, nhưng tôi không thể tìm ra vấn đề là gì. Tôi có thư mục hình ảnh trong thư mục src/main/webapp (đây là một dự án web maven). Tôi có index.jsp trong thư mục src/main/webapp/WEBINF/views.

Tôi đang cố gắng để truy cập hình ảnh và các nguồn lực khác như css và js như thế này:

<img src="/images/left_arrow.png" alt="" />

Nhưng những hình ảnh không nhận được hiển thị.

Dưới đây là file web.xml

<web-app xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" 
version="3.0"> 

<servlet> 
    <servlet-name>mvc-dispatcher</servlet-name> 
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class> 
    <load-on-startup>1</load-on-startup> 
</servlet> 

<servlet-mapping> 
    <servlet-name>mvc-dispatcher</servlet-name> 
    <url-pattern>/</url-pattern> 
</servlet-mapping> 
</web-app> 

Đây là thư mục WEB-INF/MVC-phối-servlet.xml tập tin

<beans xmlns="http://www.springframework.org/schema/beans" 
xmlns:context="http://www.springframework.org/schema/context" 
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xsi:schemaLocation=" 
    http://www.springframework.org/schema/beans  
    http://www.springframework.org/schema/beans/spring-beans-3.0.xsd 
    http://www.springframework.org/schema/context 
    http://www.springframework.org/schema/context/spring-context-3.0.xsd"> 

<context:component-scan base-package="com.ravi.WebApp" /> 

<bean 
    class="org.springframework.web.servlet.view.InternalResourceViewResolver"> 
    <property name="prefix"> 
     <value>/WEB-INF/views/</value> 
    </property> 
    <property name="suffix"> 
     <value>.jsp</value> 
    </property> 
</bean> 

</beans> 

Đây là Controller gói com.ravi. Ứng dụng web;

import org.springframework.stereotype.Controller; 
import org.springframework.ui.Model; 
import org.springframework.web.bind.annotation.RequestMapping; 

@Controller 
public class HelloController { 

@RequestMapping("/") 
public String printWelcome(Model model) { 
    return "index"; 

} 

} 

Answer 1

Hãy thử thêm việc kê khai nguồn lực sau đây để cấu hình Spring của bạn:

<!-- Handles HTTP GET requests for /images/** by efficiently serving up static resources in the ${webappRoot}/images directory --> 
<resources mapping="/images/**" location="/images/" />  

Ngoài ra, và phổ biến hơn, là phải có một thư mục resources chứa mọi nguồn lực của bạn (hình ảnh, css, js, vv ...), được chia nhỏ theo thư mục con.

cấu hình của bạn sau đó sẽ như thế nào:

<!-- Handles HTTP GET requests for /resources/** by efficiently serving up static resources in the ${webappRoot}/resources directory --> 
<resources mapping="/resources/**" location="/resources/" /> 

Và nguồn lực của bạn sẽ được tham chiếu như sau:

<link rel="stylesheet" type="text/css" href="<c:url value="/resources/css/screen.css" />" /> 
<script type="text/javascript" src="<c:url value="/resources/js/jquery-1.6.4.min.js" />"></script> 
<img src="<c:url value="/resources/images/left_arrow.png" />" alt="" /> 

Answer 2

Nếu bạn muốn giữ lại các tài nguyên tĩnh bên ngoài các thư mục WEB-INF trong của bạn gốc web và muốn vùng chứa xử lý các yêu cầu tài nguyên tĩnh, bạn nên thêm nó vào tệp ngữ cảnh ứng dụng của mình:

<mvc:default-servlet-handler /> 

Đề xuất của @BeauGrantham để thêm ánh xạ tài nguyên cũng sẽ hoạt động.

Answer 3

Bạn chỉ cần thêm một tham chiếu thư mục hình ảnh của bạn trong hồ sơ cấu hình Spring MVC

WEB-INF/lò xo context.xml:

<mvc:resources mapping="/images/*" location="/images/" /> 

Answer 4

Nếu Sử dụng chú thích sau đó hãy chắc chắn để sử dụng

<mvc:annotation-driven/> 

với nguồn

<mvc:resources mapping="/images/**" location="/images/" /> 

bộ điều khiển chú thích khác sẽ không hoạt động

Answer 5

Các đề xuất ở trên cũng phù hợp với tôi.Nhưng nếu bất cứ ai khác có rắc rối với các không gian tên có liên quan, tôi đã có thêm phần MVC để mvc-dispatcher-serlvet.xml

<beans xmlns="http://www.springframework.org/schema/beans" 
xmlns:context="http://www.springframework.org/schema/context" 
xmlns:mvc="http://www.springframework.org/schema/mvc" 
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xsi:schemaLocation=" 
    http://www.springframework.org/schema/beans  
    http://www.springframework.org/schema/beans/spring-beans-3.0.xsd 
    http://www.springframework.org/schema/context 
    http://www.springframework.org/schema/context/spring-context-3.0.xsd 
    http://www.springframework.org/schema/mvc 
    http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd "> 

... 

<mvc:annotation-driven /> 
<mvc:resources mapping="/images/**" location="/images/" /> 

Answer 6

Hãy làm theo các bước trong hình ảnh này .. :)

Bước 1: Tạo một thư mục trong webapp nhưng không phải trong WEB-INF

Tạo tài nguyên rồi đến hình ảnh rồi lưu trữ hình ảnh của bạn. webapp/nguồn/images/filename.jpg

Bước 2: Bây giờ bạn đã tạo thư mục của bạn

Chúng ta hãy lập bản đồ các con đường mà bạn đã tạo trong file cấu hình servlet nơi chúng ta đối phó với bản đồ của các đường dẫn Thêm mã này: <mvc:resources mapping="/resources/*" location="/resources/" />

Bước 3: Thêm mã để truy cập vào tài nguyên hình ảnh từ vị trí mà bạn đã tạo ở st ep 1: <img src="/attendance/resources/images/logo.png" width="100px" height="100px">