java - 将图像的 byte[] 从 Spring Controller 发送到 jQuery

Question

请告诉我如何从 Spring Controller 获取图像并在 html 上显示其图像？现在我正在尝试:

@RequestMapping(value = "dictionaries/getImage", method = RequestMethod.GET, produces = MediaType.ALL_VALUE)
@ResponseBody
public byte[] getImage(@RequestParam Long ticketTemplateId, @RequestParam String imageName) throws IOException{
    Long eventOrganizerId = eventOrganizerService.getCurrentUserOrganizerProfile().getId();
    byte[] result = fileStorageService.getImage(ticketTemplateId, eventOrganizerId, imageName);

    return result;
}

jQuery 代码:

function downloadImage() {
            var imageName = $('#slc option:selected').val();
            var ticketTemplateId = getParameterByName('id');
            $.ajax({
                url: 'getImage',
                type: 'GET',
                data: ({ticketTemplateId: ticketTemplateId, imageName: imageName}),
                success: function(data) {
                    document.getElementById("ItemPreview").src = "data:image/png;base64," + data;
                }
            })
        }

在浏览器控制台中我收到此错误:

 data:image/png;base64,%EF%BF%BDPNG%1A%00%00%00IHDR%00%00%00%EF%BF%BD%00%00%…%EF%BF%BD5%EF%BF%BD0%EF%BF%BD%EF%BF%BD%00%00%00%00IEND%EF%BF%BDB`%EF%BF%BD net::ERR_INVALID_URL

Answer 1

您无法使用 ajax 发送原始字节，它会尝试将它们解释为 Utf-16 字符串。

您可以在服务器上使用 Base64 对这些字节进行编码，然后直接使用编码的字符串(与您正在使用的 js 代码完全相同)设置 src 属性。

在java端你只需要返回Base64.getEncoder().encodeToString(result)