使用Spring MVC和Hibernate在JSP中显示jpg图像列表

Question

我寻找类似的问题，但不了解一些事情。 我的代码似乎也有效，但它不是jpg图像，而是显示一些图标。 如果你能帮到解决它会很棒。

首先，控制器：

@Controller
public class MainController {

@Autowired
private MasterpieceService masterpieceService;

@RequestMapping(value={ "/", "/home" }, method = RequestMethod.GET)
public ModelAndView firstPage(){
    ModelAndView model = new ModelAndView();
    model.addObject("masterpiece", new Masterpiece());
    model.addObject("masterpieceList", masterpieceService.getMasterpieces());
    model.setViewName("home");
    return model;
}

(...other methods...)


    @RequestMapping(value = {"/uploadMasterpiece"}, method = RequestMethod.POST)
public ModelAndView uploadMasterpiece(@RequestParam("name") String name,
                                      @RequestParam("file") MultipartFile file,
                                      @RequestParam("comment") String comment) {
    ModelAndView model = new ModelAndView();

    if(file.isEmpty()){
        // oh no.
        model.setViewName("home");
    }else {
        Masterpiece masterpiece = new Masterpiece();
        try {
            masterpiece.setName(name);
            masterpiece.setImage(file.getBytes());
            masterpiece.setComment(comment);
            masterpieceService.addMasterpiece(masterpiece);

            model.setViewName("admin");
        }catch (Exception e){
            e.printStackTrace();
            model.setViewName("home");
        }
    }
    return model;
}}

和我的JSP：

<c:if test="${!empty masterpieceList}">
<table>

    <c:forEach items="${masterpieceList}" var="masterpiece">
        <tr>
            <td>${masterpiece.name},</td>
            <td><img src="${pageContext.request.contextPath}/masterpiece/${masterpiece.image}" /> </td>
            <td>${masterpiece.comment} </td>
        </tr>
    </c:forEach>
</table>

最后，它应该像一个艺术家画廊，代表第一页上的图像表。 现在我没有任何CSS并没有搜索如何从输出中创建一个好的表，但问题是关于图像。 看起来像：

，用图标而不是图像，我想知道，为什么......

解

经过评论和回答，我最终找到了解决方案。 以前我试图直接传递图像，而不是作为网址值，这似乎是一种不好的做法。 以下是我的案例控制器中的代码：

@RequestMapping(value = "/something/getImg{masterpieceId}", method = RequestMethod.GET,
        produces = MediaType.IMAGE_JPEG_VALUE)
public ResponseEntity<byte[]> ListImage(@PathVariable long masterpieceId) throws IOException{
    Masterpiece m = masterpieceService.getMasterpieceById(masterpieceId);
    byte [] image = m.getImage();
    final HttpHeaders headers = new HttpHeaders();
    headers.setContentType(MediaType.IMAGE_JPEG);
    return new ResponseEntity<byte[]>(image, headers, HttpStatus.CREATED);
}

我的更新表格：

 <c:if test="${!empty masterpieceList}">
<table>

    <c:forEach items="${masterpieceList}" var="masterpiece">
        <tr>
            <td>${masterpiece.name},</td>
            <td><img src="/something/getImg${masterpiece.masterpieceId}" /> </td>
            <td>${masterpiece.comment} </td>
        </tr>
    </c:forEach>
</table>

Answer 1

图像不能（不应该）像HTML中的数据那样插入。 应该通过URL加载图像。

1. 使HTML像这样：img src =“/ something / getImg？id = 123”
2. 创建一个接受URL“something / getImg”的控制器。
3. 在Controller中，使用Servlet的response.Outputstream返回Image

对于要显示的每个图像，请创建IMG html元素。 每个IMG的“src”属性将指向该图像的特定URL：.. getImage？id = 111，getImage？id = 112等。控制器方法将查找请求参数“id”，并返回该id的图像。

Answer 2

损坏的图像意味着图像的URL是错误的。 您能否告诉我们页面中此图像的href值是多少？