如何知道页面何时完全加载(包括其AJAX请求)

时间:2017-07-21 14:43:54

标签: javascript angularjs ajax angular-http-interceptors

在我目前的情况下,我使用$ http拦截器捕获响应错误并显示一条简单的消息,让用户知道出错了。 但是现在我想区分加载页面期间发送的请求或由于用户自己的操作而发送的请求(按下按钮,输入字段......)。

我想要的$ httpInterceptor示例:

return {
   responseError: function (response) {
      // IF THE REQUEST IS FROM A PAGE LOAD
         // DO SOMETHING
      // IF THE REQUEST IS NOT FROM A PAGE LOAD
         // DO SOMETHING ELSE
      return $q.reject(response);
   }
};

更明确一点:

案例1:用户正在等待加载页面:

  • 已发送REQ 1
  • 已发送REQ 2
  • 发送了REQ 3
    • 在REQ 3响应后发送REQ 4
      • 在REQ 4的响应后发送REQ 5
  • 发送REQ 6
    • 在REQ 6的回复后发送REQ 7

上面的所有请求都是页面加载的一部分,如果其中一个返回错误,它应该有特定的行为。

不是因为页面加载而触发的请求:

案例2:用户按下按钮:

  • 发送REQ 1
    • 在REQ 1的响应后发送REQ 2

这些请求不是页面加载的一部分,如果出现错误,则应采取不同的行动。

有什么方法可以以某种方式在这两种情况之间产生影响吗? 由于我的项目非常庞大,我不想更改每个$ http请求的代码,以确定它是否来自页面加载,因此这对我来说不是一个解决方案。

1 个答案:

答案 0 :(得分:0)

您可以创建某种类型或正则表达式,并测试是否来自欲望网址并做出选择。

.service('RequestsInterceptor', [
'$q',
function(
  $q,
  ) {
    var UNAUTHORIZED_CODE = 401;
    var FORBIDDEN_CODE = 403;
    var NOTFOUND_CODE = 404;
    var INTERNAL_ERROR = 500;

        this.request = function(config) {
            //logic to send
            return config || $q.when(config);
        };
        this.responseError = function(rejection) {

            console.log(rejection.config.url)

            var apiPattern = /\/api\//;

            if(apiPattern.test(rejection.config.url)) {
                //do your logic when url are api
            }else{
              //do your logic when url are templates
            }
            return $q.reject(rejection);
        };
    }
]);