带有图像的本地存储

Question

我想在html5的本地存储中保存一个图像url，然后想在网页上设置该图像，并设置到另一个网页的链接（该链接地址也在本地存储中）但是我该怎么做

Update1 : 没有base64可以吗？

Answer 1

是的，你做错了！

您需要使用 base64 中的图像进行类似的操作：

<script>
var hero;

if (localStorage.getItem('heroImg')) {
    hero = localStorage.getItem('heroImg');
}
else {
    hero = '/9j/4AAQSkZJRgABAgAAZABkAAD/7    /.../    6p+3dIR//9k=';
    localStorage.setItem('heroImg', hero);
}

document.getElementById("hero-graphic").src = 'data:image/png;base64,' + hero; < /script>

</script>

相应的 HTML Image 元素：

<img id="hero-graphic" alt="Blog Hero Image" src="" / >

Answer 2

我相信，如今，在 localStorage 中存储二进制数据的唯一可靠方法是保留 Base64 编码的字符串。但您应该记住，localStorage 是有限的，并且图像可能很重（base64 使它们更重）。

我猜你正在尝试缓存你的图像。在几乎所有情况下，最好只设置正确的 http 标头，让浏览器为您完成所有肮脏而乏味的工作。相信我，情况好多了。