JSP中的图片未显示

huangapple 未分类评论51阅读模式
英文:

Pictures in JSP aren't displayed

问题

我有一个问题。我正在尝试在我的项目中向jsp文件中添加图片,但它们没有显示出来。图像位于BookStoreWebsite/web/images/BookstoreLogo.png。

这是我的jsp文件index.jsp:

     <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
        pageEncoding="ISO-8859-1"%>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="ISO-8859-1">
    <title>Evergreen Books - Online Books Store</title>
    </head>
    <body>
    <div align="center">
    		<div>
    		<img src="images/BookstoreLogo.png" />
    		</div>
    	</div>
    	
    	<div align="center">
    		<h3>This is the main content: New Books, Best Selling Books:</h3>
    		<h2>New Books:</h2>
    		<h2>Best-Selling Books:</h2>
    		<h2>Most-Favourite Books:</h2>
    	</div>
    	
    	<jsp:directive.include file="footer.jsp" />
    </body>
    </html>


[不起作用][1]



但是,当我使用来自互联网的带有链接的图像时,它可以工作。以下是一个例子:

    <div align="center">
    		<div>
    		<img src="https://image.flaticon.com/icons/png/512/3/3901.png" />
    		</div>
    	</div>

[可以工作][2]

我尝试了各种解决方案,但未能解决它:

1)我尝试了这个:

    <img src="http://localhost:8080/BookStoreWebsite/web/images/BookstoreLogo.png" />

2)以及这个

    <img src="<%= request.getContextPath() %>/images/BookstoreLogo.png">

3)我试图将图片放在项目的目录中。

4)我在Eclipse IDE中创建了一个带有Tomcat 9.0的项目。我认为也许是这个问题。然后我在IntelliJ Idea中使用Glassfish创建了相同的项目。结果一样。我怀疑问题可能出现在Servlet或web.xml中,但我不能确定。

我在这里漏掉了什么?谢谢!

这是Servlet:

    @WebServlet("/")
    public class HomeServlet extends HttpServlet {
    	private static final long serialVersionUID = 1L;
           
        public HomeServlet() {
            super(); 
        }
    
    	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    		String homepage = "frontend/index.jsp";
    		RequestDispatcher dispatcher = request.getRequestDispatcher(homepage);
    		dispatcher.forward(request, response);
    	}
    }


这是Eclipse中的web.xml:

    <?xml version="1.0" encoding="UTF-8"?>
    <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
      <display-name>BookStoreWebsite</display-name>
      <welcome-file-list>
        <welcome-file>index.html</welcome-file>
        <welcome-file>index.htm</welcome-file>
        <welcome-file>index.jsp</welcome-file>
        <welcome-file>default.html</welcome-file>
        <welcome-file>default.htm</welcome-file>
        <welcome-file>default.jsp</welcome-file>
      </welcome-file-list>
    </web-app>


这是IntelliJ中的web.xml:

    <?xml version="1.0" encoding="UTF-8"?>
    <web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
             xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
             xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
             version="4.0">
        <listener>
            <listener-class>com.sun.xml.ws.transport.http.servlet.WSServletContextListener</listener-class>
        </listener>
        <servlet>
            <description>JAX-WS endpoint</description>
            <display-name>WSServlet</display-name>
            <servlet-name>WSServlet</servlet-name>
            <servlet-class>com.sun.xml.ws.transport.http.servlet.WSServlet</servlet-class>
            <load-on-startup>1</load-on-startup>
        </servlet>
        <servlet-mapping>
            <servlet-name>WSServlet</servlet-name>
            <url-pattern>/services/*</url-pattern>
        </servlet-mapping>
    
    </web-app>



[在Eclipse中的项目][3]


[在IntelliJ中的项目][4]


  [1]: https://i.stack.imgur.com/iksUW.png
  [2]: https://i.stack.imgur.com/JOqxs.png
  [3]: https://i.stack.imgur.com/vUf2s.png
  [4]: https://i.stack.imgur.com/50OU9.png
英文:

I have a problem. I'm trying to add pictures to a jsp file in my project but they are not displayed. The image is in BookStoreWebsite/web/images/BookstoreLogo.png.

Here is my jsp file index.jsp:

 &lt;%@ page language=&quot;java&quot; contentType=&quot;text/html; charset=ISO-8859-1&quot;
    pageEncoding=&quot;ISO-8859-1&quot;%&gt;
&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta charset=&quot;ISO-8859-1&quot;&gt;
&lt;title&gt;Evergreen Books - Online Books Store&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;div align=&quot;center&quot;&gt;
		&lt;div&gt;
		&lt;img src=&quot;images/BookstoreLogo.png&quot; /&gt;
		&lt;/div&gt;
	&lt;/div&gt;
	
	&lt;div align=&quot;center&quot;&gt;
		&lt;h3&gt;This is the main content: New Books, Best Selling Books:&lt;/h3&gt;
		&lt;h2&gt;New Books:&lt;/h2&gt;
		&lt;h2&gt;Best-Selling Books:&lt;/h2&gt;
		&lt;h2&gt;Most-Favourite Books:&lt;/h2&gt;
	&lt;/div&gt;
	
	&lt;jsp:directive.include file=&quot;footer.jsp&quot; /&gt;
&lt;/body&gt;
&lt;/html&gt;

Doesn't work

But, when i use images from the internet with a link, it works. Here is an example:

&lt;div align=&quot;center&quot;&gt;
		&lt;div&gt;
		&lt;img src=&quot;https://image.flaticon.com/icons/png/512/3/3901.png&quot; /&gt;
		&lt;/div&gt;
	&lt;/div&gt;

It works

I tried various solutions but failed to fix it:

1)I tried this:

&lt;img src=&quot;http://localhost:8080/BookStoreWebsite/web/images/BookstoreLogo.png&quot; /&gt;
  1. And this

    <img src="<%= request.getContextPath() %>/images/BookstoreLogo.png">

3)I tried to put the picture in the directory of my project.

  1. I made a project in Eclipse IDE with Tomcat 9.0. I thought maybe that was the issue. Then I created the same project in IntelliJ Idea with Glassfish. The same result.
    I suspect, perhaps the problem is with the servlet or with web.xml but i don't know for sure.

What am I missing here? Thanks!

Here is the servlet:

@WebServlet(&quot;/&quot;)
public class HomeServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    public HomeServlet() {
        super(); 
    }

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String homepage = &quot;frontend/index.jsp&quot;;
		RequestDispatcher dispatcher = request.getRequestDispatcher(homepage);
		dispatcher.forward(request, response);
	}
}

Here is web.xml in Eclipse:

&lt;?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?&gt;
&lt;web-app xmlns:xsi=&quot;http://www.w3.org/2001/XMLSchema-instance&quot; xmlns=&quot;http://java.sun.com/xml/ns/javaee&quot; xsi:schemaLocation=&quot;http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd&quot; id=&quot;WebApp_ID&quot; version=&quot;3.0&quot;&gt;
  &lt;display-name&gt;BookStoreWebsite&lt;/display-name&gt;
  &lt;welcome-file-list&gt;
    &lt;welcome-file&gt;index.html&lt;/welcome-file&gt;
    &lt;welcome-file&gt;index.htm&lt;/welcome-file&gt;
    &lt;welcome-file&gt;index.jsp&lt;/welcome-file&gt;
    &lt;welcome-file&gt;default.html&lt;/welcome-file&gt;
    &lt;welcome-file&gt;default.htm&lt;/welcome-file&gt;
    &lt;welcome-file&gt;default.jsp&lt;/welcome-file&gt;
  &lt;/welcome-file-list&gt;
&lt;/web-app&gt;

Here is web.xml in Intellij:

&lt;?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?&gt;
&lt;web-app xmlns=&quot;http://xmlns.jcp.org/xml/ns/javaee&quot;
         xmlns:xsi=&quot;http://www.w3.org/2001/XMLSchema-instance&quot;
         xsi:schemaLocation=&quot;http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd&quot;
         version=&quot;4.0&quot;&gt;
    &lt;listener&gt;
        &lt;listener-class&gt;com.sun.xml.ws.transport.http.servlet.WSServletContextListener&lt;/listener-class&gt;
    &lt;/listener&gt;
    &lt;servlet&gt;
        &lt;description&gt;JAX-WS endpoint&lt;/description&gt;
        &lt;display-name&gt;WSServlet&lt;/display-name&gt;
        &lt;servlet-name&gt;WSServlet&lt;/servlet-name&gt;
        &lt;servlet-class&gt;com.sun.xml.ws.transport.http.servlet.WSServlet&lt;/servlet-class&gt;
        &lt;load-on-startup&gt;1&lt;/load-on-startup&gt;
    &lt;/servlet&gt;
    &lt;servlet-mapping&gt;
        &lt;servlet-name&gt;WSServlet&lt;/servlet-name&gt;
        &lt;url-pattern&gt;/services/*&lt;/url-pattern&gt;
    &lt;/servlet-mapping&gt;

&lt;/web-app&gt;

Project in Eclipse

Project in IntelliJ

答案1

得分: 0

你的 index.jsp 不在与图片相同的文件夹中。你需要上升一级然后指向 images/BookstoreLogo.png。

src="../images/BookstoreLogo.png"

当然,还有更好的方法是将 images 文件夹添加到你的类路径中,然后就可以像你所指定的那样访问它。
或者在我看来,更好的方法是获取上下文并像这样引用你的图片:

<img src="${pageContext.request.contextPath}/images/logo.png"/>

或者

<img src="<%= request.getContextPath() %>/images/logo.png"/>
英文:

Your index.jsp is not located in the same folder as the images. You need to come one level up and then point to images/BookstoreLogo.png.

src=&quot;../images/BookstoreLogo.png&quot;

Of course there is a better way of adding the images folder to your classpath and then it will be accessible like you have addressed it.
Or better in my opinion is to get the context and address your images like:

&lt;img src=&quot;${pageContext.request.contextPath}/images/logo.png&quot;/&gt;

or

&lt;img src=&quot;&lt;%= request.getContextPath() %&gt;/images/logo.png&quot;/&gt;

huangapple
  • 本文由 发表于 2020年5月4日 17:45:01
  • 转载请务必保留本文链接:https://java.coder-hub.com/61589295.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定