web-dev-qa-db-fra.com

Comment ajouter un en-tête à la demande dans Jquery Ajax?

J'essaie d'ajouter un en-tête à la demande en Ajax avec JQuery.

Voici le code: -

$ .ajax ({
 type: "POST", 
 contentType: "application/json", 
 url: "http: // localhost: 8080/core-service/services /v1.0/patients/registerPatients",
 données: JSON.stringify (patientDTO), 
 // crossDomain: true, 
 dataType: 'json', 
 en-têtes: {"X-AUTH-TOKEN": jeton}, 
 succès: fonction (patientDTO) {
 console.log ("SUCCESS:", patientDTO); 
/* location.href = "fieldagentHRA.html"; */
 if (typeof (Storage)! == "undefined") {
 localStorage.setItem ("patUrn", patientDTO.data); 
 location.href = "fieldagentHRA.html"; 
} 
}, 
 erreur: fonction (e) {
 console.log (" ERREUR: ", e); 
 Affiche (e); 
}, 
 Fait: fonction (e) {
 EnableRegisterButton (true); 
} 
});

J'ai inspecté cela avec chrome et j'ai trouvé que le corps de l'en-tête n'était pas ajouté . Without Header Body

Ensuite, j'ai utilisé Requestly ( Requestly est un plugin chrome + firefox avec lequel nous pouvons ajouter manuellement un en-tête à la demande ).

Après avoir ajouté manuellement l'en-tête: -

After Manually Adding the header

Dans les deux, l'en-tête de demande de photos x-auth-token est présent dans "ACCESS-CONTROL-REQUEST-HEADERS" mais l'en-tête "X-AUTH-TOKEN" ainsi que la valeur d'en-tête sont présents dans la deuxième image qui n'est pas là dans la première image.

Donc, ma question est de savoir comment ajouter des en-têtes de demande dans Ajax avec JQuery?

ajaxheaderrequest-headersjquery-ajaxq
13
Safdar Akrami

Il existe quelques solutions en fonction de ce que vous voulez faire

Si vous souhaitez ajouter un en-tête personnalisé (ou un ensemble d'en-têtes) à une demande individuelle, ajoutez simplement la propriété headers et cela vous aidera à envoyer votre demande avec des en-têtes.

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

Si vous souhaitez ajouter un en-tête par défaut (ou un ensemble d'en-têtes) à chaque demande, utilisez $.ajaxSetup(): cela vous aidera à ajouter des en-têtes.

//Setup headers here and than call ajax
$.ajaxSetup({
    headers: { 'x-my-custom-header': 'some value' }
});

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

ajoutez un en-tête (ou un ensemble d'en-têtes) à chaque demande, puis utilisez le hook beforeSend avec $ .ajaxSetup ():

//Hook your headers here and set it with before send function.
$.ajaxSetup({
    beforeSend: function(xhr) {
        xhr.setRequestHeader('x-my-custom-header', 'some value');
    }
});

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

Lien de référence: AjaxSetup

Lien de référence: AjaxHeaders

28
Soni Vimalkumar