在我的网站中使用 localStorage 进行翻译，而不是每次我再次访问该页面时都加载它们答案

【问题标题】：Using localStorage for translations in my website instead of loading them every time i visit the page again在我的网站中使用 localStorage 进行翻译，而不是每次我再次访问该页面时都加载它们
【发布时间】：2020-07-13 08:32:21
【问题描述】：

我有一个功能可以从 ajax 请求将翻译加载到我的网站，但我想让我的代码保存这些翻译，然后从 localStorage 加载它而不是再次请求。

我怎样才能让它们保存到 localStorage？

【问题讨论】：

标签： javascript ajax local-storage

【解决方案1】：

您有多种选择。

首先，您需要认识到这里的一些陷阱。如果您告诉您的网站将翻译存储在本地存储中，那么如果将来需要更改翻译，则可能有也可能没有更新翻译的方法。此外，如果您更新网站并添加翻译会发生什么？您可能会发现自己需要对本地存储中的数据进行哈希处理，只是为了询问服务器翻译是否发生了变化。

可能最强的选择是将翻译作为静态数据直接注入网页。这样就不需要ajax请求。这可能需要服务器端渲染，所以如果这不是一个选项是可以理解的。

如果您坚持使用本地存储，请考虑以下技术来使用相同的翻译键管理多个页面：

为所有翻译键使用命名空间，例如page1:mName 和第 2 页：mName。
使用每页本地存储。而不是总是将每个页面的翻译保存到相同的本地存储键中，将每个页面放入它自己的本地存储密钥中

将字符串保存到本地存储的代码是：

localStorage.setItem(key, value)

并从本地存储中读取密钥：

localStorage.getItem(key)

【讨论】：

新翻译无关紧要。是的，每一页都有不同的名字。所以我只是想找出一种将它们放入存储的正确方法。代码会是什么样子？
你问我如何使用本地存储？请看developer.mozilla.org/en-US/docs/Web/API/Window/localStorage