1

当我们有一个原生/混合移动应用程序时，它通常归结为通过移动应用程序 UI 改变应用程序状态的用户操作。

但是现在，当我们有一个渐进式 Web 应用程序（可能还不是全屏 UI，因为用户尚未将其添加到主屏幕等）时，我们继承了一些额外的用户操作，我们必须将其视为事实来源：

  • 用户可以更改/输入新的 URL
  • 用户可以后退/前进
  • 用户可以点击刷新

因此，让我们假设以下上下文：

  • 我们有一个带有一些延迟加载页面的 PWA：主页、aboutpage、userpage。
  • 此示例没有登录身份验证等
  • 当用户导航到 www.ourprogressivewebapp.com 他们登陆主页：https://ourprogressivewebapp.com/#/home.page
  • 我们 PWA 的导航堆栈现在有 rootPage = homepage

给出上述“状态”的问题：

  1. 当用户此时点击刷新时会发生什么？用户第一次输入原始网址（www.ourprogressivewebapp.com）和点击“刷新”（现在地址字段显示https://ourprogressivewebapp.com/#/主页）

  2. 现在，如果用户在应用程序的 ui 中单击“转到关于页面”，该页面延迟加载并被推送到导航堆栈（用户看到： https ://ourprogressivewebapp.com/#/about.page，rootpage 是主页，但我们也有关于现在堆栈中的页面）。如果用户现在点击刷新会发生什么？应用程序会“跳过”加载主页吗？

  3. 最后一个，现在用户点击了用户页面，它也被“推”到了导航堆栈（https://ourprogressivewebapp.com/#/user.page）。如果这个用户开始在他们的浏览器中按“返回”会发生什么？这将被解释为 pop() 方法并且这些页面将“脱离堆栈”或者从应用程序的状态角度来​​看在这种情况下真正发生了什么？

我正在寻找直接答案或帮助指出详细介绍此行为的文章。

4

1 回答 1

1

在前提条件下，即使在添加到主屏幕后也可以按返回和刷新。可以使用“Android 的后退按钮”或 iOS 和某些 Android 中的手势滑动来执行后退。下拉页面会刷新页面。由于地址栏不可见，因此无法编辑 URL。

在所有路由条件下，这与 PWA 无关。这完全取决于 Angular Route 的实现方式，其行为与非 PWA 应用程序相同。我们在开发中有我们的 Angular 应用程序，我们在产品构建中不使用 PWA 模式（Angular 6+ 中的默认行为）和 PWA 模式。路由和刷新在这两种模式下都是一样的，并且按照我们的路由编码方式工作。

于 2018-07-02T18:33:30.447 回答