javascript - 在 Javascript 中显示数据库图像

Question

我正在使用 Ionic 2 在 Java 和 MySQL 数据库中调用 RESTful 服务 (JSON)。我正在尝试显示存储在数据库中的图像，并用 ionic 渲染它。

一切都很完美，除了我在努力显示图像之外。

我有一个 PNG 图像存储在 MySQL 中(类型 LONGBLOB)。然后我访问它，并在 Java 中将其转换为 Base64。

import org.apache.commons.codec.binary.Base64;
subCategory.setIcon(Base64.encodeBase64(subCategory.getIcon()));

JSON:

"icon" : "Vm0wd2QyUXlVWGxWV0d4V1YwZDRWMVl3Wk...lpRVVQwOQ=="

然后通过 JSON 接收后，我将其显示在 html 中:

<img src="data:image/png;base64,{{item.icon}}" />

它只显示没有图像的图像占位符。

我也尝试用这个Javascript解码图像:

icon = atob(icon);

和

 b64DecodeUnicode(str) {
    return decodeURIComponent(Array.prototype.map.call(atob(str), function(c) {
        return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
    }).join(''));
}

没有成功。

Answer 1

这个有效:

<img src="data:image/png;base64,{{item.icon64}}" />

和

  b64DecodeUnicode(str) {
    return decodeURIComponent(Array.prototype.map.call(atob(str), function(c) {
        return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
    }).join(''));
}