基于Ext.Net实现浏览器关闭确认及服务器端操作需求

嘿，我来帮你搞定这个需求！首先得指出你原代码里的一个关键问题：现代浏览器对window.onbeforeunload事件的限制非常严格，你在里面调用的Ext.Msg.confirm自定义弹窗会被浏览器直接拦截，根本不会显示给用户，更别说触发后续的服务器操作了。

下面是正确的实现方案，分两步来：

1. 显示标准的浏览器确认提示，告知用户后果 #

我们需要用浏览器原生的确认框来提示用户，明确说明放弃表单的影响。代码如下：

window.addEventListener('beforeunload', function(e) {
  // 这里写清楚用户离开会产生的后果，比如丢失数据、触发删除操作
  const warningMessage = 'Seguro que quieres salir? Abandonar este formulario eliminará tus cambios y registrará el abandono.';
  
  // 兼容不同浏览器的设置方式，确保提示框能正常显示
  e.preventDefault();
  e.returnValue = warningMessage;
  return warningMessage;
});

这段代码会在用户关闭标签页、刷新页面或导航到其他地址时，弹出浏览器自带的确认对话框，显示你设置的提示信息。

2. 用户确认离开后，执行服务器端操作 #

当用户确认要离开时，我们需要发送请求到服务器执行你的RegistrarAbandono操作。这里推荐使用navigator.sendBeacon API，它专门设计用于页面卸载时发送请求，不会阻塞页面关闭，比普通的AJAX更可靠：

window.addEventListener('unload', function() {
  // 把你的服务器端接口地址填在这里，比如对应Ext.Direct的RegistrarAbandono的接口路径
  // 如果是用Ext.Direct，你也可以把它封装成符合sendBeacon要求的请求格式
  navigator.sendBeacon('/api/registrar-abandono');
});

如果你的App.direct.RegistrarAbandono是ExtJS的Direct方法，你可以查看它对应的请求URL和参数，然后用sendBeacon发送对应的FormData或JSON数据，确保请求能被服务器正确处理。

关键注意事项 #

• 绝对不要在beforeunload里使用自定义弹窗（比如Ext.Msg.confirm），现代浏览器都会阻止这类操作，这是出于用户体验和安全的考虑。
• navigator.sendBeacon是异步的，但浏览器会确保它在页面卸载完成前发送出去，比同步AJAX更友好，不会让用户感觉到页面卡顿。
• 提示信息一定要清晰明确，让用户清楚知道离开会带来什么后果，避免产生误解。

内容的提问来源于stack exchange，提问作者Duban Ortiz