在 Blazor 服务器端中，如何检测用户是否尝试离开当前页面

Question

我正在开发一个 ASP.NET Core 3.1 Blazor 服务器端应用程序，该应用程序具有一个带有 EditForm 的 Blazor 组件。我想警告用户，如果他们尝试离开页面（即单击浏览器后退按钮或进行导航菜单选择以在同一应用程序中加载另一个页面），他们有未保存的数据。

我有 read posts 关于使用 javascript window.onbeforeunload 但我不确定在 Blazor 服务器端调用 javascript 是否会弄乱 SignalR 连接。

我也有 read posts 关于使用 CircuitHandler，但我不确定如果用户只是移动到同一应用程序中的不同页面，SignalR 电路是否会发生变化。

关于如何最好地处理此要求的任何建议？

Answer 1

我猜想只为程序化导航这样做是有意的，因为不可能阻止人们点击标签时发生的导航。对于 Blazor Server，逻辑必须异步运行，因此无法取消 JS 事件。对于 Blazor WebAssembly 或任何基于 JS 的 SPA 框架的事件，阻止对标签的点击是没有意义的，因为浏览器并不总是尊重您的意图（例如，如果用户右键单击并选择在新选项卡中打开）。

SteveSandersonMS

另见this和this

如您所见，在这方面可以做的不多。但是，您应该以一种可以让您尽可能多地控制用户操作的方式设计您的页面，包括将表单中输入的数据保存在本地存储中并在用户等情况下检索它的好主意突然退出您的应用等。

注意：您可以将 JSInterop 与 SignalR 一起使用。没问题。

注意：CircuitHandler 处理 websocket 连接的生命周期，可能只满足您的部分要求。