将图像从 API 发送到 HTML 的正确方法是什么？

Question

我目前的实现如下：

我将图像以二进制数据存储在数据库中。 然后我加载它并将其作为 Http 响应中的 Base64 数据发送。

应用程序接口：

    @Lob
    @Column(length = 16777215)
    private byte[] image;

然后在 UI 中加载<img ng-src="data:image/png;base64, {{product.image}}">

对于某些图像，HTTP 响应是巨大的。 它适用于几张图像，但假设我想显示 100 张图像。

这是快速完成的正确方法吗？

Answer 1

您可以尝试将 URL 传递给图像节点中的 API。 例如：

<img ng-src="https://api.myhost.com/product/5646/image" />

在大多数情况下，它应该可以正常工作。

Answer 2

我不相信有办法解决这个问题，您只是将图像的大小转移到 HTML 中。

我建议不要将图像存储在数据库中，正确的做法是将图像存储在文件系统上并将 URL 存储在数据库中。

这应该使您的 HTTP 响应较小，并且 HTML 加载速度很快。