PWA脱机授权

Question

在离线时重新访问应用时，在PWA中对用户进行身份验证的最佳方法是什么。

实施例..

1. 用户通过互联网连接访问网络应用。
2. 用户登录并下载所有需要的数据（indexeddb）。
3. 用户关闭页面。
4. 用户返回页面（无网络）。
5. 用户已登录..

5是我需要建议的部分，日志需要是安全的，因此cookies / localstorage中的令牌不够好。

请问任何建议？

Answer 1

如果您想让您的应用记住用户，并且您需要自动将令牌存储在某处。将它存储在本地存储中应该没问题。

如果在ng se-configuration中设置dataGroup，Angular会存储外部请求。这是基于URI缓存的。您现在可以看到两个选项：

选项1： 返回每个API响应中的用户ID，如果您使用jwt令牌，则将用户ID存储在令牌主体中。当您在Angular过滤器中收到基于该ID的API请求时。当您拥有网络连接时，这将无法执行任何操作，因为您只拥有用户可以看到的内容。但是当您离线时，您无法保证缓存的数据来自当前用户。如果用户A登录并获取数据，则用户B登录但不提取该数据，则缓存的响应包含用户A而非B的数据，而B不应该看到它。此选项的问题是用户A的响应仍然存储在缓存中，因此如果用户B要查看服务工作者缓存，那么他们就会看到它。

选项2： 在登录或注销时手动使服务工作者为外部api请求存储的数据无效。这将保证缓存的数据属于当前用户。选项1的优点是，您不需要在响应中存储和检查用户的ID，因为您知道它必须是用户的ID。此外，您不必担心另一个用户正在查看服务工作者缓存并查看其他人的响应，因为当第一个用户注销或第二个用户登录时，这些响应将被记入。是你手动必须使服务工作者缓存无效，因为Angular没有适当的机制来为你服务。

选项3： 将用户ID添加到URI。由于Angular以URI作为密钥存储数据，因此如果您将用户ID添加到URI，它将存储该用户（和其他用户）的api响应。这可能听起来很理想，但这意味着任何用户都可以转到服务工作者缓存，并查看为登录到此Workstation中的应用程序的每个用户缓存的api响应。此外，您的API请求URI不应将用户ID作为其一部分;它应来自令牌主体或查询。你应该不惜一切代价避免这个选择！

我建议1或2，具体取决于您是否愿意尝试使服务工作缓存无效。