Question

我有一个Vaadin 7应用程序，我需要可靠地检测用户离开或导航离开页面以进行一些清理。

我的目标是让页面弹出一个关闭浏览器/选项卡的确认对话框，如果用户选择离开页面，那么我会执行清理操作。

我对JavaScript很缺乏经验，但是从我发现的内容来看，＃onbeforeunload＆＃39;和＆＃39; onunload＆＃39;是要使用的功能。

此时，我在进入页面时使用以下代码：

JavaScript.getCurrent().execute(
    "beforeCloseListenerGlobal = function beforeCloseListener (e) {\nvar e = e || window.event;\nvar message = " + LEAVE_PAGE_MESSAGE + ";\nif(e) e.returnValue = message;\nreturn message;\n};\n" +
    "closeListenerGlobal = function closeListener () {\ncatchClose();\n};\n" +
    "addCloseListenersGlobal = function addCloseListeners () {\nwindow.addEventListener('beforeunload', beforeCloseListenerGlobal);\nwindow.addEventListener('unload', closeListenerGlobal);\n};\n" +
    "removeCloseListenersGlobal = function removeCloseListeners () {\nwindow.removeEventListener('beforeunload', beforeCloseListenerGlobal);\nwindow.removeEventListener('unload', closeListenerGlobal);\n};"       
);

然后，当我点击＆＃34;开始＆＃34;我界面上的按钮开始操作：

JavaScript.getCurrent().execute("addCloseListenersGlobal();");

当我离开我的网页时，通过关闭标签，我会得到一个确认弹出窗口，就像我想要的那样。但是，如果我点击“是”，页面会关闭但我的“卸载”页面会被关闭。事件不会发生。当我点击相应的＆＃34;停止＆＃34;按钮，清理工作正常，所以我知道那部分没问题。

从我读过的主要浏览器开始，我们都支持onunload（我已尝试过Firefox，Chrome，Safari和Opera）。更有意思的是，如果我使用下面的代码，那么我的closeListener会在＆amp; loading＆＃39;之前触发。听众，但不是在卸载＆＃39;监听器：

JavaScript.getCurrent().execute(
    "function closeListener() { catchClose(); } " +
    "window.addEventListener('beforeunload', closeListener); " +
    "window.addEventListener('unload', closeListener);"
);

所以我的问题是，“卸载”的原因可能是什么？听众不要开火？这种方法是一种执行清理操作的好方法吗？

注意：下面是我在网页关闭时清理操作的函数回调，以防对“卸载”有任何影响。监听器。我根本没有打印出来，所以这意味着＆＃34; catchClose＆＃34;函数未被调用。

JavaScript.getCurrent().addFunction("catchClose", arguments -> {
    System.out.println("catchClose callback from " + Page.getCurrent().getWebBrowser().getBrowserApplication());
    presenter.webPageClosed();
});

编辑：通过进一步调查，实际看起来好像卸载方法偶尔会正确启动，但我无法确定它何时以及为什么会这样做。另外，我发现如果我在我的＆＃34; closeListener＆＃34;中放置一个断点。函数，它被调用，我的卸载工作绝对正常。

编辑：对我来说，现在好像代码适用于Safari，Firefox和Opera，但不适用于Chrome。我怀疑是由于my related question的副作用，我现在已经解决了。

Answer 1

我找到了解决问题的方法。

我怀疑大多数问题都是通过my other related issue的解决方案解决的，该解决方案涉及将某些代码部分放入同步方法中。解决此问题后，卸载方法适用于我测试过的大多数浏览器。但是，Chrome仍在播放，只会在浏览器关闭时触发卸载事件，而不会在关闭标签上触发。添加'pagehide'监听器似乎意味着Chrome标签关闭现在正在正常运作。

所以，'unload'和'pagehide'事件的组合似乎适用于所有浏览器，并且（截至目前为止）似乎是可靠的，并且我的清理总是在执行时执行用户离开页面。

Vaadin JavaScript卸载事件监听器未触发

1 个答案: