Ember - Abort ajax请求

时间:2013-02-17 10:19:03

标签: ajax xmlhttprequest ember.js ember-data

我想知道如何中止请求。

例如,我发出App.MyModel.find()后来我想在从服务器返回之前取消/中止它。我希望这样的事情:

var res = App.MyModel.find();   //request sent to server
res.abort();                    // abort the request before completion

但这不起作用 - 返回的对象是promise,并且既没有abort也没有cancel方法。

澄清

我正在寻找如何在底层XMLHttpRequest对象上调用abort方法。

3 个答案:

答案 0 :(得分:7)

对于那些想知道如何做到这一点的人,以下是我实现取消jquery ajax请求的方法。

首先,我在我的应用程序商店中定义了一个新方法,它将在我的自定义RESTAdapter上调用cancelQuery。

App.Store = DS.Store.extend({
  cancelQuery: function(type){
    var adapter = this.adapterFor(this.modelFor(type).modelName);
    if(typeof adapter.cancelQuery === 'function'){
      adapter.cancelQuery();
    }
  }
});

在我的自定义RESTAdapter中,我定义了这个新函数并覆盖了像这样的ajaxOptions:

App.YOURMODELAdapter = DS.RESTAdapter.extend({
  jqXHRs: [],
  ajaxOptions: function(url, type, hash) {
    // Get default AjaxOptions
    var ajaxOptions = this._super(url, type, hash);

    // If the function was defined in the DS.RESTAdapter object,
    // we must call it in out new beforeSend hook.
    var defaultBeforeSend = function(){};
    if(typeof ajaxOptions.beforeSend === 'function'){
      defaultBeforeSend = ajaxOptions.beforeSend;
    }
    ajaxOptions.beforeSend = function(jqXHR, settings){
      defaultBeforeSend(jqXHR, settings);
      this.jqXHRs.push(jqXHR); // Keep the jqXHR somewhere.
      var lastInsertIndex = this.jqXHRs.length - 1;
      jqXHR.always(function(){
        // Destroy the jqXHRs because the call is finished and 
        // we don't need it anymore.
        this.jqXHRs.splice(lastInsertIndex,1);
      });
    };

    return ajaxOptions;
  },
  // The function we call from the store.
  cancelQuery: function(){
    for(var i = 0; i < this.jqXHRs.length; i++){
      this.jqXHRs[i].abort();
    }
  }
});

现在,您可以在控制器的上下文中调用cancelQuery

this.store.cancelQuery('yourmodel');

答案 1 :(得分:0)

我相信,当您致电App.MyModel.find()时,它会返回RecordArray,而不是promise

从查看RESTAdapter的ember-data源代码,我认为没有办法在XMLHttpRequest对象上调用abort。

您可以实现自己的RESTAdapter:

var myRESTAdapter = DS.Adapter.create({
  find: function (store, type, id) {
    var req = $.ajax({
      url:      type.url,
      dataType: 'jsonp',
      context:  store,
      success:  function(response){
        this.load(type, id, response.data);
      }
    });
    req.abort();
  },
  findAll: function(store, type) {
    var req = $.ajax({
      url:      type.url,
      dataType: 'jsonp',
      context:  store,
      success:  function(response){
        this.loadMany(type, response.data);
      }
    });
    req.abort();
  }
});

并在XMLHttpRequest对象中调用abort。

答案 2 :(得分:-1)

Http是请求 - 响应交互。一旦请求被发送,就无法取消。你可以通过某种方式忽略来自服务器的响应;