Wie kann ich einer Ajax-Anfrage mit js oder jQuery einen benutzerdefinierten HTTP-Header hinzufügen?

Weiß jemand, wie man einen benutzerdefinierten HTTP-Header mit JavaScript oder jQuery hinzufügt oder erstellt?

Es gibt verschiedene Lösungen, je nachdem, was Sie brauchen ...

Wenn Sie einer einzelnen Anforderung einen benutzerdefinierten Header (oder eine Reihe von Headern) hinzufügen möchten, fügen Sie einfach die headersEigenschaft hinzu:

// Request with custom header
$.ajax({
    url: 'foo/bar',
    headers: { 'x-my-custom-header': 'some value' }
});

Wenn Sie jeder Anforderung einen Standardheader (oder eine Reihe von Headern) hinzufügen möchten, verwenden Sie $.ajaxSetup():

$.ajaxSetup({
    headers: { 'x-my-custom-header': 'some value' }
});

// Sends your custom header
$.ajax({ url: 'foo/bar' });

// Overwrites the default header with a new header
$.ajax({ url: 'foo/bar', headers: { 'x-some-other-header': 'some value' } });

Wenn Sie jeder Anforderung einen Header (oder eine Reihe von Headern) hinzufügen möchten, verwenden Sie den beforeSendHook mit $.ajaxSetup():

$.ajaxSetup({
    beforeSend: function(xhr) {
        xhr.setRequestHeader('x-my-custom-header', 'some value');
    }
});

// Sends your custom header
$.ajax({ url: 'foo/bar' });

// Sends both custom headers
$.ajax({ url: 'foo/bar', headers: { 'x-some-other-header': 'some value' } });

Bearbeiten (weitere Informationen): Beachten Sie, dass ajaxSetupSie mit nur einen Satz von Standardheadern definieren können und nur einen beforeSend. Wenn Sie ajaxSetupmehrmals anrufen , wird nur der letzte Satz von Headern gesendet und nur der letzte Rückruf vor dem Senden wird ausgeführt.

Wenn Sie den benutzerdefinierten Header für jede zukünftige Anforderung senden möchten, können Sie Folgendes verwenden:

$.ajaxSetup({
    headers: { "CustomHeader": "myValue" }
});

Auf diese Weise enthält jede zukünftige Ajax-Anforderung den benutzerdefinierten Header, sofern dies nicht ausdrücklich durch die Optionen der Anforderung überschrieben wird. Weitere Informationen finden Sie ajaxSetup hier

Angenommen, JQuery Ajax, können Sie benutzerdefinierte Header wie - hinzufügen.

$.ajax({
  url: url,
  beforeSend: function(xhr) {
    xhr.setRequestHeader("custom_header", "value");
  },
  success: function(data) {
  }
});

Hier ist ein Beispiel mit XHR2:

function xhrToSend(){
    // Attempt to creat the XHR2 object
    var xhr;
    try{
        xhr = new XMLHttpRequest();
    }catch (e){
        try{
            xhr = new XDomainRequest();
        } catch (e){
            try{
                xhr = new ActiveXObject('Msxml2.XMLHTTP');
            }catch (e){
                try{
                    xhr = new ActiveXObject('Microsoft.XMLHTTP');
                }catch (e){
                    statusField('\nYour browser is not' + 
                        ' compatible with XHR2');                           
                }
            }
        }
    }
    xhr.open('POST', 'startStopResume.aspx', true);
    xhr.setRequestHeader("chunk", numberOfBLObsSent + 1);
    xhr.onreadystatechange = function (e) {
        if (xhr.readyState == 4 && xhr.status == 200) {
            receivedChunks++;
        }
    };
    xhr.send(chunk);
    numberOfBLObsSent++;
}; 

Ich hoffe, das hilft.

Wenn Sie Ihr Objekt erstellen, können Sie mit der Funktion setRequestHeader einen Namen und einen Wert zuweisen, bevor Sie die Anforderung senden.

Sie können dies auch ohne jQuery tun. Überschreiben Sie die Sendemethode von XMLHttpRequest und fügen Sie dort den Header hinzu:

XMLHttpRequest.prototype.realSend = XMLHttpRequest.prototype.send;
var newSend = function(vData) {
    this.setRequestHeader('x-my-custom-header', 'some value');
    this.realSend(vData);
};
XMLHttpRequest.prototype.send = newSend;

Sie sollten die Verwendung von $.ajaxSetup()wie in den Dokumenten beschrieben vermeiden . Verwenden Sie stattdessen Folgendes:

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

Angenommen, Sie meinen "Bei Verwendung von Ajax" und "Ein HTTP- Anforderungsheader ", dann verwenden Sie die headersEigenschaft in dem Objekt, an das Sie übergebenajax()

Header (hinzugefügt 1.5)

Standard: {}

Eine Karte mit zusätzlichen Header-Schlüssel / Wert-Paaren, die zusammen mit der Anforderung gesendet werden sollen. Diese Einstellung wird festgelegt, bevor die Funktion beforeSend aufgerufen wird. Daher können alle Werte in der Header-Einstellung in der beforeSend-Funktion überschrieben werden.

- http://api.jquery.com/jQuery.ajax/

Die Methode "setRequestHeader" des XMLHttpRequest-Objekts sollte verwendet werden

http://help.dottoro.com/ljhcrlbv.php

Sie können js fetch verwenden

async function send(url,data) {
  let r= await fetch(url, {
        method: "POST", 
        headers: {
          "My-header": "abc"  
        },
        body: JSON.stringify(data), 
  })
  return await r.json()
}

// Example usage

let url='https://server.test-cors.org/server?enable=true&status=200&methods=POST&headers=my-header';

async function run() 
{
 let jsonObj = await send(url,{ some: 'testdata' });
 console.log(jsonObj[0].request.httpMethod + ' was send - open chrome console > network to see it');
}

run();