ajax add custom header
AJAX Add Custom Header
If you want to add custom headers to your AJAX request, you can use the setRequestHeader()
method.
Method 1: Using setRequestHeader()
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com', true);
xhr.setRequestHeader('X-Custom-Header', 'CustomValue');
xhr.send();
In the above code, we create a new instance of XMLHttpRequest and open a GET request to the URL 'http://example.com'. We then use the setRequestHeader()
method to add a custom header with the name 'X-Custom-Header' and the value 'CustomValue'. Finally, we send the request using the send()
method.
Method 2: Using headers option in jQuery AJAX
$.ajax({
url: 'http://example.com',
type: 'GET',
headers: {
'X-Custom-Header': 'CustomValue'
},
success: function(data) {
console.log(data);
}
});
In the above code, we use the jQuery AJAX function to make a GET request to the URL 'http://example.com'. We pass an object with the headers
property set to an object with the custom header name and value. We also specify a success callback function to handle the response data.
Method 3: Using fetch API
fetch('http://example.com', {
headers: {
'X-Custom-Header': 'CustomValue'
}
})
.then(response => response.text())
.then(data => console.log(data));
In the above code, we use the fetch API to make a GET request to the URL 'http://example.com'. We pass an object with the headers
property set to an object with the custom header name and value. We then chain two then()
methods to handle the response data.