admin管理员组

文章数量:1391987

I'm using $.ajax for many requests each one has a different settings and values passed to the function.

I need to check whether these settings are merged correctly into $.ajax settings.

var options = {
  endpoint: '/path/page'
  method : "POST",
  mode: 'abort',
  data : { value : $(this).val() },
  headers : { 'X-Key' : 'value' }
}

$.ajax( $.extend(true, {
    url: endpoint,
    type: 'GET',
    cache: true,
    dataType: 'json',
    contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
    headers : {
        'X-Same-Domain':'1',
    },
    async: true,
    data: data,
    timeout: 5000,
}, options) )

How can I see in console those settings used by $.ajax request on success or failure?

I'm using $.ajax for many requests each one has a different settings and values passed to the function.

I need to check whether these settings are merged correctly into $.ajax settings.

var options = {
  endpoint: '/path/page'
  method : "POST",
  mode: 'abort',
  data : { value : $(this).val() },
  headers : { 'X-Key' : 'value' }
}

$.ajax( $.extend(true, {
    url: endpoint,
    type: 'GET',
    cache: true,
    dataType: 'json',
    contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
    headers : {
        'X-Same-Domain':'1',
    },
    async: true,
    data: data,
    timeout: 5000,
}, options) )

How can I see in console those settings used by $.ajax request on success or failure?

Share Improve this question asked Nov 30, 2014 at 19:09 Adriano RosaAdriano Rosa 8,7711 gold badge28 silver badges25 bronze badges
Add a ment  | 

3 Answers 3

Reset to default 6

This question is old, but it can help those in need from now on with low plexity. It is possible to decorate the jqxhr with settings in the .ajaxSend, with this it will be passed on to all the flow where the jqxhr is after sending.

$(document).ajaxSend(function (event, jqxhr, settings) {
  jqxhr.settings = settings;
});

jQuery doesn't seem to support this but you can implement this yourself:

function ajax(options) {
    var defer = $.Deferred();
    $.ajax(options)
        .done(function(data, textStatus, jqXHR) {
            defer.resolve(data, textStatus, jqXHR, options);
        })
        .fail(function(jqXHR, textStatus, errorThrown) {
            defer.reject(jqXHR, textStatus, errorThrown, options);
        });
    return defer.promise();
}

Usage

var options = {
    endpoint: '/path/page'
    method : "POST",
    mode: 'abort',
    data : { value : $(this).val() },
    headers : { 'X-Key' : 'value' }
};

ajax($.extend(true, {
    url: endpoint,
    type: 'GET',
    cache: true,
    dataType: 'json',
    contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
    headers : {
        'X-Same-Domain':'1',
    },
    async: true,
    data: data,
    timeout: 5000,
}, options)).done(function(data, textStatus, jqXHR, ajaxOptions) {
    console.log("done", ajaxOptions);
}).fail(function(jqXHR, textStatus, errorThrown, ajaxOptions) {
    console.log("fail", ajaxOptions);
});

Typically, you will do something like this :

var defaults = {...};

...

var options = {...};

var ajaxSettings = $.extend(true, {}, defaults, options);
console.log(ajaxSettings);

$.ajax(ajaxSettings).then(function(result) {
    // success handler
    // `ajaxSettings` is still in scope here
}, function(error) {
    // error handler
    // `ajaxSettings` is still in scope here
});

本文标签: javascriptGet settings used by jquery ajax requestStack Overflow