【问题标题】：jQuery ajax beforeSend shadows the `$.ajaxSetup` one, How to cascade it?jQuery ajax beforeSend 遮住了`$.ajaxSetup` 一，如何级联呢？
【发布时间】：2015-12-24 01:47:27
【问题描述】：

我正在使用 django-rest-framework。

而且我必须在每个 jquery ajax 发送之前添加 X-CSRFToken 标头。

参考：https://docs.djangoproject.com/en/1.8/ref/csrf/#ajax

jQuery.ajaxSetup({
    beforeSend: function(xhr, settings) {
        if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
            xhr.setRequestHeader("X-CSRFToken", Cookies.get('csrftoken'));
        }
    }
});

所以，在我使用给定的 beforeSend 设置进行 ajax 调用之前，一切都很好：

jQuery.ajax({
    url: '...',
    data: { ... },
    beforeSend: function(xhr, settings) {
        // This function do shadows the ajaxSetup one.
    }
});

那么，有没有什么有效的方法可以在jQuery.ajaxSetup 调用上级联 beforeSend 处理器？

【问题讨论】：

标签： javascript jquery ajax xmlhttprequest django-rest-framework

【解决方案1】：

实际上，在jQuery Event的jQuery文档中，从$.ajax调用或$.ajaxSetup设置beforeSend被称为Local Event，但在当前情况下，使用$(document).ajaxSend() 被称为 全局事件 更合适。

最终解决方案

如果要在ajax发送上添加多个全局事件处理器，请不要在$.ajaxSetup上设置。

改用`ajaxSend` 事件！

http://api.jquery.com/ajaxSend/

所以代码可能看起来像：

function csrfSafeMethod(method) {
    // these HTTP methods do not require CSRF protection
    return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
}
$(document).ajaxSend(function(event, xhr, settings) {
    if (!csrfSafeMethod(settings.type) && !settings.crossDomain) {
        xhr.setRequestHeader("X-CSRFToken", Cookies.get('csrftoken'));
    }
});

【讨论】：

【解决方案2】：

如果在$.ajaxSetup 中定义一个新的beforeSend 注入，我可以级联在之前的$.ajaxSetup 中定义的其他注入：

(function() {
    function csrfSafeMethod(method) {
        // these HTTP methods do not require CSRF protection
        return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
    }
    var originBeforeSend = jQuery.ajaxSettings.beforeSend;
    jQuery.ajaxSetup({
        beforeSend: function(xhr, settings) {
            // Call the previous beforeSend processor first.
            if(originBeforeSend && originBeforeSend(xhr, settings) === false) {
                return false;
            }
            if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
                xhr.setRequestHeader("X-CSRFToken", Cookies.get('csrftoken'));
            }
        }
    });
})();

但是无论如何，如果我在$.ajax() 调用中指定了另一个beforeSend，那么这种方式就没有运气了。它仍然被阴影覆盖。

【讨论】：

最终解决方案

改用ajaxSend 事件！

改用`ajaxSend` 事件！