如何从Spring Controller返回字节数组作为图像，以便浏览器可以显示它？] << [

Question

我想向Spring Controller发出GET请求，并将存储的字节数组转换为图像，然后接收该图像作为响应并在浏览器中显示该图像。

作为测试图像，我正在使用5x5 px蓝绿色纯色图像，并通过GIMP将其导出为JPG：

为了获得base64编码的图像，我使用了this webpage。这是我得到的Base64编码的字符串：

/ 9j / 4AAQSkZJRgABAQEAYABgAAD // gATQ3JlYXRlZCB3aXRoIEdJTVD / 4gKwSUNDX1BST0ZJTEUAAQEAAAKgbGNtcwQwAABtbnRyUkdCIFhZWiAH5AABAAEADwAZAABhY3NwQVBQTAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA9tYAAQAAAADTLWxjbXMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA1kZXNjAAABIAAAAEBjcHJ0AAABYAAAADZ3dHB0AAABmAAAABRjaGFkAAABrAAAACxyWFlaAAAB2AAAABRiWFlaAAAB7AAAABRnWFlaAAACAAAAABRyVFJDAAACFAAAACBnVFJDAAACFAAAACBiVFJDAAACFAAAACBjaHJtAAACNAAAACRkbW5kAAACWAAAACRkbWRkAAACfAAAACRtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACQAAAAcAEcASQBNAFAAIABiAHUAaQBsAHQALQBpAG4AIABzAFIARwBCbWx1YwAAAAAAAAABAAAADGVuVVMAAAAaAAAAHABQAHUAYgBsAGkAYwAgAEQAbwBtAGEAaQBuAABYWVogAAAAAAAA9tYAAQAAAADTLXNmMzIAAAAAAAEMQgAABd7 //// MlAAAHkwAA/ ZD //// uh //// 9ogAAA9wAAMBuWFlaIAAAAAAAAG + gAAA49QAAA5BYWVogAAAAAAAAJJ8AAA + EAAC2xFhZWiAAAAAAAABilwAAt4cAABjZcGFyYQAAAAAAAwAAAAJmZgAA8qcAAA1ZAAAT0AAACltjaHJtAAAAAAADAAAAAKPXAABUfAAATM0AAJmaAAAmZwAAD1xtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAEcASQBNAFBtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEL / 2wBDAAMCAgMCAgMDAwMEAwMEBQgFBQQEBQoHBwYIDAoMDAsKCwsNDhIQDQ4RDgsLEBYQERMUFRUVDA8XGBYUGBIUFRT / 2wBDAQMEBAUEBQkFBQkUDQsNFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT / wgARCAAFAAUDAREAAhEBAxEB / 8QAFAABAAAAAAAAAAAAAAAAAAAAAAAB // EABUBAQEAAAAAAAAAAAAAAAAAAAAAAYH / 9oADAMBAAIQAxAAAAFWQQT / xAAUEAEAAAAAAAAAAAAAAAAAAAAAAAAAAA / 9oACAEBAAEFAn // xAAUEQEAAAAAAAAAAAAAAAAAAAAAAAA / 9oACAEDAQE / AX // xAAUEQEAAAAAAAAAAAAAAAAAAAAA / 9oACAECAQE / AX // xAAUEAEAAAAAAAAAAAAAAAAAAAAAAAAAAA / 9oACAEBAAY / An //xAAUEAEAAAAAAAAAAAAAAAAAAAAAAAA / 9oACAEBAAE / IX // 2gAMAwEAAgADAAAAEL // xAAUEQEAAAAAAAAAAAAAAAAAAAAA / 9oACAEDAQE / EH // xAAUEQEAAAAAAAAAAAAAAAAAAAAAAAA / 9oACAECAQE / EH //xAAUEAEAAAAAAAAAAAAAAAAAAAAAAAA / 9oACAEBAAE / EH // 2Q ==

我只是使用Controller返回此字符串。

在请求中，无论我使用Angular还是仅使用Firefox，我都将Accept标头设置为image / jpeg，在Firefox中，我看到以下内容：

图像...因为有错误而无法显示

查看回复时，我看到：

控制器：

import org.springframework.http.MediaType;
import org.springframework.web.bind.annotation.*;

@RestController
@CrossOrigin(origins = "http://localhost:4200")
public class ThumbnailController {
    @GetMapping(value = "/thumbnail/{id}", produces = MediaType.IMAGE_JPEG_VALUE)
    public @ResponseBody byte[] getThumbnail(@PathVariable long id) {
        return "/9j/4AAQSkZJRgABAQEAYABgAAD//gATQ3JlYXRlZCB3aXRoIEdJTVD/4gKwSUNDX1BST0ZJTEUAAQEAAAKgbGNtcwQwAABtbnRyUkdCIFhZWiAH5AABAAEADwAZAABhY3NwQVBQTAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA9tYAAQAAAADTLWxjbXMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA1kZXNjAAABIAAAAEBjcHJ0AAABYAAAADZ3dHB0AAABmAAAABRjaGFkAAABrAAAACxyWFlaAAAB2AAAABRiWFlaAAAB7AAAABRnWFlaAAACAAAAABRyVFJDAAACFAAAACBnVFJDAAACFAAAACBiVFJDAAACFAAAACBjaHJtAAACNAAAACRkbW5kAAACWAAAACRkbWRkAAACfAAAACRtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACQAAAAcAEcASQBNAFAAIABiAHUAaQBsAHQALQBpAG4AIABzAFIARwBCbWx1YwAAAAAAAAABAAAADGVuVVMAAAAaAAAAHABQAHUAYgBsAGkAYwAgAEQAbwBtAGEAaQBuAABYWVogAAAAAAAA9tYAAQAAAADTLXNmMzIAAAAAAAEMQgAABd7///MlAAAHkwAA/ZD///uh///9ogAAA9wAAMBuWFlaIAAAAAAAAG+gAAA49QAAA5BYWVogAAAAAAAAJJ8AAA+EAAC2xFhZWiAAAAAAAABilwAAt4cAABjZcGFyYQAAAAAAAwAAAAJmZgAA8qcAAA1ZAAAT0AAACltjaHJtAAAAAAADAAAAAKPXAABUfAAATM0AAJmaAAAmZwAAD1xtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAEcASQBNAFBtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEL/2wBDAAMCAgMCAgMDAwMEAwMEBQgFBQQEBQoHBwYIDAoMDAsKCwsNDhIQDQ4RDgsLEBYQERMUFRUVDA8XGBYUGBIUFRT/2wBDAQMEBAUEBQkFBQkUDQsNFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT/wgARCAAFAAUDAREAAhEBAxEB/8QAFAABAAAAAAAAAAAAAAAAAAAAB//EABUBAQEAAAAAAAAAAAAAAAAAAAYH/9oADAMBAAIQAxAAAAFWQQT/xAAUEAEAAAAAAAAAAAAAAAAAAAAA/9oACAEBAAEFAn//xAAUEQEAAAAAAAAAAAAAAAAAAAAA/9oACAEDAQE/AX//xAAUEQEAAAAAAAAAAAAAAAAAAAAA/9oACAECAQE/AX//xAAUEAEAAAAAAAAAAAAAAAAAAAAA/9oACAEBAAY/An//xAAUEAEAAAAAAAAAAAAAAAAAAAAA/9oACAEBAAE/IX//2gAMAwEAAgADAAAAEL//xAAUEQEAAAAAAAAAAAAAAAAAAAAA/9oACAEDAQE/EH//xAAUEQEAAAAAAAAAAAAAAAAAAAAA/9oACAECAQE/EH//xAAUEAEAAAAAAAAAAAAAAAAAAAAA/9oACAEBAAE/EH//2Q==".getBytes();
    }
}

我以为Spring会神奇地将字节数组转换为图像，但是似乎我缺少了一些步骤。也许缺少元数据，并且浏览器不知道如何显示图像，因为它仅包含内容并且不知道如何呈现它？

我想向Spring Controller发出GET请求，并将存储的字节数组转换为图像，然后接收该图像作为响应并在浏览器中显示该图像。作为测试图像，我是...

Answer 1

签出以下tutorial。它显示了如何从REST API返回图像响应]

Answer 2

[获取API是将base64编码的值作为字节数组返回。基本上，您必须解码从上述API返回的base64值，并通过在运行时创建文件来尝试在浏览器中呈现图像。请检查下面的参考代码