AngularJS:选项卡/浏览器关闭时的服务器调用

Question

>我的应用程序中有一个部分，我在服务器和客户端之间建立了永久循环的通信，直到用户离开此屏幕。当用户离开屏幕时，我检测到此问题$rootScope.$on('$stateChangeStart')并发送$http调用以停止服务器中的进程。

我想在用户关闭当前选项卡或浏览器时执行相同的$http，但我无法完成此操作。

首先，这是进行$http调用的服务函数：

function cancelCommProcess(webId, commActionId) {
return $http.get(BASE_URL + '/rest/comm/kill-current-com-process/' + webId + '/' + commActionId)
.then(
function(response) {
return response;
}
);
}

正如我所说，当我在$rootScope.$on('$stateChangeStart')或其他一些点调用这个函数时，它会起作用。

现在我有以下代码在选项卡/浏览器关闭时调用此函数：

$window.onbeforeunload = function (evt) {
if ($rootScope.CMC_ACTION_IDENTIFIER.CMC_ACTION_MONITORING === currentCommActionId) {
CMCService.cancelCommProcess(currentWebId, currentCommActionId)
.then(
function() {
console.log('HELLO');
}
);
}
}

这样，$http调用就不会到达服务器，但是如果我只是进行了下一个更改，那么它就可以工作：

$window.onbeforeunload = function (evt) {
if ($rootScope.CMC_ACTION_IDENTIFIER.CMC_ACTION_MONITORING === currentCommActionId) {
CMCService.cancelCommProcess(currentWebId, currentCommActionId)
.then(
function() {
myTest();
}
);
}
}
function myTest() {
console.log('HELLO');
}

更重要的是，以前的方法适用于Chrome和Firefox，但不适用于Edge。但是如果我这样做，它可以工作(我的意思是，$http调用到达服务器)：

$window.onbeforeunload = function (evt) {
if ($rootScope.CMC_ACTION_IDENTIFIER.CMC_ACTION_MONITORING === currentCommActionId) {
CMCService.cancelCommProcess(currentWebId, currentCommActionId)
.then(
function() {
myTest();
//console.log('HELLO');
}
);
}
return "";
}
function myTest() {
console.log('HELLO');
}

当然，我会收到离开或保留页面的确认消息，但我不知道为什么调用仅通过显示此消息即可到达服务器。

我真的不明白这是如何工作的，所以我感谢您的帮助。$http调用的想法是告诉服务器中断当前的通信过程，但我觉得这种方法是不真实的。

你能帮我找出最好的方法吗？

谢谢。

Answer 1

我建议您使用保持客户端和服务器之间连接活动而不是在服务器中循环的 socket.io。

此事件在控制器解冻时触发，您可以使用它

$scope.$on('$destroy', function() {
console.log("destory");
});