如何在jsp页面上显示mysql数据库中的图像和文本

Question

我正在做一个Java Web应用程序，我需要同时从MySQL数据库显示图像和文本。请帮助我在数据库的同一“ JSP”页面上显示图像和文本。我的图像以blob的形式存储在MySQL中。

Answer 1

您可以定义servlet，该servlet可以将图像发送给用户http://www.javatpoint.com/example-to-display-image-using-servlet

然后定义从Blob检索图像http://codeglobe.blogspot.com/2009/03/readwrite-blob-fromto-mysql-in-java_21.html

在您的jsp页面中，只需添加指向图像的链接

<img src="http://example.com/getImage?imageId=1234">

因此，当用户单击链接时，将调用您的servlet。 Servlet从BLOB读取图像并将其发送到响应。

更新：

您也可以尝试http://www.roseindia.net/tutorial/java/jsp/jspdisplayblob.html

Answer 2

这不是HTML的工作方式。

浏览器首先请求服务器提供所有文本内容。 然后，浏览器会分别向服务器请求图像内容，js内容，css内容等。因此，您无法使用jsp在页面上“写”图像，而不能像编写文本，表格等那样“写”图像。图像需要有src“ URL”。

如果图像内容来自数据库，则URL必须是servlet。 它基本上是从数据库获取图像，然后将其转换为流并发送回浏览器。

如果您绝对希望文本和图像来自同一servlet，那么也许可以使用请求参数...

这是一个示例servlet和html。 看看您是否可以在项目中使用类似的样式

Servlet（这将从磁盘加载映像。更改代码以从数据库加载）

@WebServlet("/Servlet2")
public class Servlet2 extends HttpServlet {
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        String id = request.getParameter("id");
        if(id!=null && "1".equalsIgnoreCase(id)){
             response.setContentType("image/jpeg");
             response.getOutputStream().write( Files.readAllBytes(new File(getServletContext().getRealPath("****.jpg")).toPath()));
             response.getOutputStream().close();
        }else {
             response.getWriter().println("Sample text");
             response.getWriter().close();
        }
    }

    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException,
            IOException {

    }
}

HTML（通过AJAX加载文本。如果需要，可以使用AJAX加载文本和图像）

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script>
function load()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("textDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","Servlet2?id=2",true);
xmlhttp.send();
}
</script>

</head>
<body onload="load()">
<div id="textDiv"></div>
<br/>
<input type="image" src="http://localhost:8080/ImageCanvas/Servlet2?id=1"/>
</body>
</html>