如何在显示之前从 URL 缓存图像答案

【问题标题】：How to cache an image from URL before displaying it如何在显示之前从 URL 缓存图像
【发布时间】：2015-09-09 02:35:37
【问题描述】：

基本上，此应用应在视图中包含一组对象，以显示每个对象的代表性图像（即电影应显示其海报）。

谈到电影，我正在尝试使用 IMDB API 来检索特定电影标题（包括其海报）的元数据。但是，一旦从 API 获取图像的 URL，热链接将不允许我显示图像（我不断收到“GET [...] 403 Forbidden”错误...）。

由于我使用 JSONStore 功能来缓存数据，我想知道是否有可能将这些图像存储在 JSONStore 中，然后像普通浏览器一样显示它们。我正在尝试使用 AngularJS、HTML5 和 JavaScript 从前端而不是后端做所有这些事情。

您对这类问题有什么建议吗？

谢谢。

【问题讨论】：

【解决方案1】：

建议的解决方案：您需要做的是将图像编码为 base64，这样您就可以将二进制图像作为字符串存储在 JSONStore 集合中。

当您需要显示它时，您需要将字符串 base64 解码回图像并在 HTML 中显示

【讨论】：

感谢您的建议。既然图片元素是使用AngularJS动态获取的，那么这个转换应该在什么时候进行呢？目前，图像源是使用 javascript 从外部 API 检索，然后呈现为“ng-src”属性。
啊，如果我想使用适配器完成检索，我的建议会更好。
适配器强制您将应用程序部署到 WebSphere Application 服务器。由于这不是我的情况，我一直在寻找一种避免使用适配器的直接前端解决方案。如果我能够使用它们，我会改用 Java 来做这件事。 :-)
MobileFirst 应用程序通常部署到 MobileFirst Server，使您能够访问其大部分功能。如果您没有使用任何 MobileFirst 本身，那么这不是 IBM MobileFirst 问题。
这只是一个碰巧用 MobileFirst 开发的网络应用程序，但在你的问题的上下文中，没有什么是 MobileFirst 独有的。