主动中断请求

简介: For 体验: 很多时候,请求后台接口比较慢,还在等待返回。如果此时用户选择了切换页面,这时候我们可以选择将还在进行中的请求主动中断。jQuery参考//可以在通用的入口abort()掉requestvar request = $.ajax({ type: 'POST', url: 'someurl', success: functi

For 体验: 很多时候,请求后台接口比较慢,还在等待返回。如果此时用户选择了切换页面,这时候我们可以选择将还在进行中的请求主动中断。

jQuery

参考

//可以在通用的入口abort()掉request
var request = $.ajax({
  type: 'POST',
  url: 'someurl',
  success: function(result){}
});

request.abort();

Angular1.x

$http
$q
$http(config)

angular.module('app.services', [])
// 发送中的请求
.factory('PendingRequests', [
  function(){
    var list = []; // 私有变量
    return {
      push: function(canceller){
        list.push(canceller);
      },
      remove: function(canceller){
        var index = _.indexOf(list, canceller);
        if (index > -1) {
          list.splice(index, 1);
        }
      },
      clear: function(){
        _.forEach(list, function(item){
          item.resolve();
        });
        list = [];
      }
    };
  }
])

// 请求包装
.factory('RequestWrapper', [
          '$q', '$http', 'PendingRequests',
  function($q ,  $http ,  PendingRequests){
    function wrapper(type, config, options){
      // 自动中断的canceller
      var canceller;
      // 主动传入 `timeout` 不自动中断
      if (!config.hasOwnProperty('timeout')) {
        canceller = $q.defer();
        config.timeout = canceller.promise;
      }

      var req = $http(config);
      if (canceller) {
        PendingRequests.push(canceller);
      }

      var defer = $q.defer();
      req.then(function(res){
        var match = type === 'array' ?
            angular.isArray(res.data) :
            angular.isObject(res.data) && !angular.isArray(res.data);
        if (match) {
          defer.resolve(res.data);
        } else {
          res.TypeError = true;
          defer.reject(res);
        }
      }, function(res){
        defer.reject(res);
        if (res.status === 0) {
          // 请求主动中断
          return;
        }
      });

      if (canceller) {
        // 请求已完成,从 pending 中移除
        req['finally'](function(){
          PendingRequests.remove(canceller);
        });
      }
      return defer.promise;
    }

    // array 或 object 两种返回
    return {
      array: function(req, options){
        return wrapper('array', req, options);
      },
      object: function(req, options){
        return wrapper('object', req, options);
      }
    };
  }
])
目录
相关文章
|
XML JSON 定位技术
06 公众号开发 - 接收普通消息和被动回复消息
06 公众号开发 - 接收普通消息和被动回复消息
179 0
|
23天前
|
机器学习/深度学习 人工智能 运维
智能化运维:从被动响应到主动预防####
【10月更文挑战第29天】 本文探讨智能化运维(AIOps)如何通过融合大数据、机器学习与自动化技术,推动IT运维管理从传统的被动响应模式向主动预防机制转变。不同于传统摘要概述全文内容的方式,本文摘要旨在直接揭示智能化运维的核心价值——利用智能算法预测潜在故障,减少系统停机时间,提升运维效率与服务质量,同时强调其在现代企业IT架构中的关键作用。 ####
53 9
|
2月前
|
人工智能 安全 网络协议
如何防御DDoS攻击?教你由被动安全转变为主动安全
如何防御DDoS攻击?教你由被动安全转变为主动安全
402 0
|
4月前
|
存储 分布式计算 Prometheus
什么是主动和被动的“NameNode”?
【8月更文挑战第31天】
45 0
|
7月前
|
监控 安全 持续交付
【专栏】Webhook是服务器主动发送事件通知的机制,打破传统客户端轮询模式,实现数据实时高效传递。
【4月更文挑战第29天】Webhook是服务器主动发送事件通知的机制,打破传统客户端轮询模式,实现数据实时高效传递。常用于持续集成部署、第三方服务集成、实时数据同步和监控告警。具有实时性、高效性和灵活性优势,但也面临安全风险和调试挑战。理解并善用Webhook能提升系统性能,广泛应用于现代软件开发和集成。
442 0
|
网络架构
微信公众平台开发(10)--接收并回复用户消息(被动回复)
本文目录 1. 用户消息的类型 2. 消息路由器与消息处理器 3. 接受并回复消息 4. 发送方与接收方 5. 小结
771 0
|
机器学习/深度学习 算法 安全
主动学习方法实践:让模型变“主动”
在机器学习的监督学习中,我们的目标是让模型不断学习带有标签的历史数据,从而提高模型在该领域的泛化能力。一般情况下,在上述的过程中,模型所学习的历史数据都是事先准备好的(数据采集,预处理,打标),有多少数据,模型就学习多少数据。换言之,模型在被动地学习我们事先提供的数据。本文分享一种主动学习方法,让模型参与“学习样本”的选择,根据不同策略,对样本池中的所有样本进行区分,提升模型性能。
805 0
主动学习方法实践:让模型变“主动”
|
数据采集 监控 微服务
服务监控信息到底是“主动推送”还是“被动扫描”???
服务监控信息到底是“主动推送”还是“被动扫描”???
1588 0
|
监控 Shell 开发工具