Js veya jQuery ile ajax isteğine nasıl özel bir HTTP üstbilgisi ekleyebilirim?

JavaScript veya jQuery kullanarak özel bir HTTP üstbilgisi eklemeyi veya oluşturmayı bilen var mı?

İhtiyacınıza bağlı olarak çeşitli çözümler var ...

Tek bir isteğe özel bir üstbilgi (veya üstbilgi kümesi) eklemek istiyorsanız , headersözelliği eklemeniz yeterlidir:

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

Her isteğe varsayılan bir üstbilgi (veya üstbilgi kümesi) eklemek istiyorsanız şunu kullanın $.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' } });

Her isteğe bir üstbilgi (veya üstbilgi kümesi) eklemek istiyorsanız, aşağıdakileri içeren beforeSendkancayı kullanın $.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' } });

Düzenleme (daha fazla bilgi): Dikkat edilmesi gereken bir şey ajaxSetup, yalnızca bir varsayılan üstbilgi kümesi tanımlayabilmeniz ve yalnızca bir tanesini tanımlayabilmenizdir beforeSend. Birden ajaxSetupçok kez ararsanız , yalnızca son başlık kümesi gönderilir ve yalnızca son göndermeden önceki geri arama yürütülür.

Veya, gelecekteki her istek için özel üstbilgi göndermek istiyorsanız, aşağıdakileri kullanabilirsiniz:

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

Bu şekilde, gelecekteki her ajax isteği, isteğe bağlı seçenekler tarafından açıkça geçersiz kılınmadıkça özel üstbilgiyi içerir. Burada daha fazla bilgi bulabilirsinizajaxSetup

JQuery ajax varsayarsak, aşağıdaki gibi özel başlıklar ekleyebilirsiniz -

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

İşte XHR2 kullanan bir örnek:

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++;
}; 

Umarım yardımcı olur.

Nesnenizi oluşturursanız, isteği göndermeden önce bir ad ve bir değer atamak için setRequestHeader işlevini kullanabilirsiniz.

Bunu jQuery kullanmadan da yapabilirsiniz. XMLHttpRequest'in gönderme yöntemini geçersiz kılın ve başlığı oraya ekleyin:

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;

Dokümanlarda$.ajaxSetup() açıklandığı gibi kullanımından kaçınmalısınız . Bunun yerine aşağıdakileri kullanın:

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

"Ajax kullanırken" ve "HTTP İsteği üstbilgisi" demek istediğinizi varsayarsak, ilettiğiniz headersnesnede özelliği kullanınajax()

başlıklar (1.5 eklendi)

Varsayılan: {}

İstekle birlikte gönderilecek ek başlık anahtarı / değer çiftlerinin haritası. Bu ayar, beforeSend işlevi çağrılmadan önce yapılır; bu nedenle, üstbilgiler ayarındaki herhangi bir değerin beforeSend işlevi içinden yazılabilir.

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

XMLHttpRequest nesnesinin "setRequestHeader" yöntemi kullanılmalıdır

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

Js fetch kullanabilirsiniz

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();