Angular 7 个 PWA 网络存储选项
Angular 7 PWA web storage choices
我正在使用 Angular 7 创建 PWA 应用程序。我正在决定如何在本地存储一些数据并有两个选择：
- 本地存储
- IndexedDB
localstorage的优点是
- 同步
- Returns 字符串
locstorages 的缺点
- ServiceWorker 无法访问本地存储
- 不安全
IndexedDB 的优点是
- 比本地存储
更多的存储space
- 可以存储和检索对象
- 基于承诺
IndexedDB 的缺点
- 在 Firefox 私人会话中不可用
现在为了存储数据，如果我使用 IndexedDB，来自 Firefox Private 会话的用户将无法使用我的网站，如果我使用 localstorage，我将无法利用 ServiceWorker。
您是如何解决 IndexedDB 和 LocalStorage 的上述问题的？
在那种情况下只是一个建议，为什么您可以检查用户是否处于隐私浏览状态以及他是否使用本地存储。
像这样检查 PB ->
var db = indexedDB.open("test");
db.onerror = function(){/Firefox PB enabled/};
db.onsuccess =function(){/Not enabled/};
更多参考 -> Detecting if a browser is using Private Browsing mode
首先，了解PWA或P渐进Web根据定义，pp 必须支持所有浏览器，并且在本质上应该是渐进式的，即，根据浏览器的功能，应用程序必须适应并选择要利用的功能才能使用户高兴。
A quick analogy:
A Shark in a fish tank will grow 7 Inch but in the Ocean it will grow
7+ Feet.
Your App is like a SHARK!
Fish tank/Ocean is like your Browser !!
Resources of Fish tank/Ocean are your Browser Features
Be it Fish tank or Ocean, a shark is still a shark (It looks like one,
it preys). What differs is the scale/size/capacity/performance (e.g.,
Sharks in the Ocean have larger teeth and prey larger fish).
打个比方，您的应用程序设计不能完全依赖 Database/Storage（或任何其他浏览器功能）来呈现自身，但同时，如果支持，它应该能够使用它们浏览器，以提供更好的用户体验。 （意思是，即使某些奇怪的浏览器不支持 localStorage，PWA 也应该可以工作——要求太多了！）
进一步阐述，您的应用程序可以尝试在浏览器上使用 IndexedDB，如果没有，请提供适当的回退机制（回退 根本不需要本地存储 ！ ，但也许是一个简单的渲染）。 IndexedDB 用于存储大量需要丰富查询能力的数据，而 localStorage 类似于 sessionStorage，即使您关闭 window 仍然存在，通常用于存储一些 key/value 对。尝试使用一个而不是另一个是不正确的 - 它们适用于不同类型的 datasets/usecases.
In short, in PWA context, it is WRONG to think "IndexedDB or Local
Storage?", but to consider what experiences you want to provide your
users based on limiting Browser features at your disposal.
祝你的 PWA 好运！！！
Interesting read on available storage options on different browsers
https://developers.google.com/web/fundamentals/instant-and-offline/web-storage/#comparison
我正在使用 Angular 7 创建 PWA 应用程序。我正在决定如何在本地存储一些数据并有两个选择：
- 本地存储
- IndexedDB
localstorage的优点是
- 同步
- Returns 字符串
locstorages 的缺点
- ServiceWorker 无法访问本地存储
- 不安全
IndexedDB 的优点是
- 比本地存储 更多的存储space
- 可以存储和检索对象
- 基于承诺
IndexedDB 的缺点
- 在 Firefox 私人会话中不可用
现在为了存储数据，如果我使用 IndexedDB，来自 Firefox Private 会话的用户将无法使用我的网站，如果我使用 localstorage，我将无法利用 ServiceWorker。
您是如何解决 IndexedDB 和 LocalStorage 的上述问题的？
在那种情况下只是一个建议，为什么您可以检查用户是否处于隐私浏览状态以及他是否使用本地存储。
像这样检查 PB ->
var db = indexedDB.open("test");
db.onerror = function(){/Firefox PB enabled/};
db.onsuccess =function(){/Not enabled/};
更多参考 -> Detecting if a browser is using Private Browsing mode
首先，了解PWA或P渐进Web根据定义，pp 必须支持所有浏览器，并且在本质上应该是渐进式的，即，根据浏览器的功能，应用程序必须适应并选择要利用的功能才能使用户高兴。
A quick analogy:
A Shark in a fish tank will grow 7 Inch but in the Ocean it will grow 7+ Feet.
Your App is like a SHARK!
Fish tank/Ocean is like your Browser !!
Resources of Fish tank/Ocean are your Browser Features
Be it Fish tank or Ocean, a shark is still a shark (It looks like one, it preys). What differs is the scale/size/capacity/performance (e.g., Sharks in the Ocean have larger teeth and prey larger fish).
打个比方，您的应用程序设计不能完全依赖 Database/Storage（或任何其他浏览器功能）来呈现自身，但同时，如果支持，它应该能够使用它们浏览器，以提供更好的用户体验。 （意思是，即使某些奇怪的浏览器不支持 localStorage，PWA 也应该可以工作——要求太多了！）
进一步阐述，您的应用程序可以尝试在浏览器上使用 IndexedDB，如果没有，请提供适当的回退机制（回退 根本不需要本地存储 ！ ，但也许是一个简单的渲染）。 IndexedDB 用于存储大量需要丰富查询能力的数据，而 localStorage 类似于 sessionStorage，即使您关闭 window 仍然存在，通常用于存储一些 key/value 对。尝试使用一个而不是另一个是不正确的 - 它们适用于不同类型的 datasets/usecases.
In short, in PWA context, it is WRONG to think "IndexedDB or Local Storage?", but to consider what experiences you want to provide your users based on limiting Browser features at your disposal.
祝你的 PWA 好运！！！
Interesting read on available storage options on different browsers https://developers.google.com/web/fundamentals/instant-and-offline/web-storage/#comparison