How can I add a custom HTTP header to ajax request with js or jQuery?

Question

Does anyone know how to add or create a custom HTTP header using JavaScript or jQuery?

Answer 1

You should avoid the usage of $.ajaxSetup() as described in the docs. Use the following instead:

$(document).ajaxSend(function(event, jqXHR, ajaxOptions) {
    jqXHR.setRequestHeader('my-custom-header', 'my-value');
});