如何在Spring MVC中显示多个base64编码的图像

在Spring MVC中显示多个base64编码的图像，可以按照以下步骤进行操作：

创建一个Spring MVC的控制器(Controller)类，用于处理请求和返回响应。
在控制器中，定义一个方法来处理显示多个base64编码的图像的请求。可以使用@RequestParam注解来接收多个base64编码的图像数据。
在方法中，将接收到的base64编码的图像数据解码为字节数组，并将其转换为图片对象。
将图片对象存储在一个集合中，以便后续处理。
在视图层(View)中，使用HTML的img标签来显示每个图像。可以使用Thymeleaf等模板引擎来动态生成HTML代码。
遍历存储图像的集合，在img标签的src属性中使用data URI scheme来显示每个图像。data URI scheme可以将图像数据直接嵌入到HTML中，而不需要额外的请求。

以下是一个示例代码：

@Controller
public class ImageController {
    
    @RequestMapping("/displayImages")
    public String displayImages(@RequestParam("images") List<String> imageList, Model model) {
        List<Image> images = new ArrayList<>();
        
        for (String base64Image : imageList) {
            byte[] imageBytes = Base64.getDecoder().decode(base64Image);
            Image image = new Image(imageBytes);
            images.add(image);
        }
        
        model.addAttribute("images", images);
        
        return "imageDisplay";
    }
}

在上述示例中，displayImages方法接收一个名为images的请求参数，该参数是一个包含多个base64编码的图像数据的列表。将解码后的图像对象存储在images集合中，并将其添加到模型(Model)中。

在视图层中，可以使用Thymeleaf模板引擎来遍历images集合，并使用data URI scheme来显示每个图像。以下是一个简化的imageDisplay.html模板文件示例：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Image Display</title>
</head>
<body>
    <h1>Images</h1>
    
    <div th:each="image : ${images}">
        <img th:src="'data:image/jpeg;base64,' + ${#strings.toString(image.data)}" />
    </div>
</body>
</html>

在上述示例中，使用Thymeleaf的th:each指令遍历images集合，并在每次迭代中使用data URI scheme来显示图像。image.data表示图像对象的字节数组。

请注意，上述示例中的代码仅为演示目的，实际应用中可能需要根据具体需求进行适当的修改和优化。

推荐的腾讯云相关产品和产品介绍链接地址：