How to set headers in Ajax call?

Question

I am developing multi-language website using Angularjs and a Web api as backend. I am trying to send RequestedPlatform and RequestedLanguage in the header whenever I make an API call.

Below is my Ajax request call.

$http.post(url,RegistrationData).then(function (response) {
 var pageList = response.data.ID;
 toastr.success('', 'Registered Succesfully');
 $state.go('Registration.OTPVerification', { pageList });
 }, function (error) {
 toastr.error('', 'Error Occured');
 });

updated code

var RegistrationData = {
 FirstName: $scope.user.Fname,
 LastName: $scope.user.Lname,
 Password: $scope.user.password,
 Gender: "Male",
 DateOfBirth: "2017-04-04",
 Nationality: $scope.user.selectedGlobe,
 Mobile_CountryCod: "91",
 MobileNumber: $scope.user.mobilenumber,
 EmailId: $scope.user.email,
 Home_Location: $scope.user.homeLocation,
 Home_City: $scope.user.homeCity,
 Home_Neighbourhood: $scope.user.homeNeighbourhood,
 Home_HouseNumber: $scope.user.housenumber,
 Home_MainStreet: $scope.user.homemainstreet,
 Home_SubStreet: $scope.user.homesubstreet,
 Work_Location: $scope.user.worklocation,
 Work_City: $scope.user.workcity,
 Work_Neighbourhood: $scope.user.workNeighbourhood,
 Work_HouseNumber: $scope.user.workhousenumber,
 Work_MainStreet: $scope.user.workmainstreet,
 Work_SubStreet: $scope.user.worksubstreet
 };
 var req = {
 method: 'POST',
 url: url,
 data: { RegistrationData: RegistrationData },
 headers: {
 RequestedPlatform: "Web",
 RequestedLanguage: "English"
 }
 }
 $http(req).then(function (response) {
 var pageList = response.data.ID;
 toastr.success('', 'Registered Succesfully');
 $state.go('Registration.OTPVerification', { pageList });
 }, function () {
 toastr.error('', 'Error Occured');
 });

May I get some help to set headers in Ajax. Any help would be appreciated.

Answer 1

you can send headers with headers property of $http

var req = {
 method: 'POST',
 url: 'http://example.com',
 headers: {
 'Content-Type': undefined
 },
 data: { test: 'test' }
}
$http(req).then(function(){...}, function(){...});

and if you want headers for all the requests that can be fully configured by accessing the $httpProvider.defaults.headers configuration object,

Reference

• Niranjan Godbole: Thanks. I updated my code. I am able to make request but data is not submitting. Any idea?
• xkeshav: if you are sending custom headers then you need to configure on the server side to allow and accept custom headers

Answer 2

There are few ways and I have posted one which I have been using it for a while. I hope you are looking for the below

$http.post('test', data, {
 withCredentials : false,
 transformRequest : angular.identity,
 headers : {
 'Content-Type' : undefined
 }
})