AngularJs DELETE with data sets wrong content-type header

Question

I am making a $http DELETE request with a payload but the content-type is wrong. I have a data object, but the content-type is getting set to text/plain instead of application/json. As you can see from the code below and the network request below there is in fact a data object with values. Is there a work around for this? Much Thanks!

code:

    $http({  
        method: "DELETE",  
        url: ".../v2/places/" + place.id + "/locations/remove",  
        data: location,  
        headers: { Authorization: "Bearer " + rootServices.getToken() }  
    })  

chrome network request summary:

Remote Address:54.83.54.37:443
URL:../v2/places/53b43e03e4b00cb25bcb16af/locations/remove
Request Method:DELETE
Status Code:500 Internal Server Error Request
Accept:application/json, text/plain, */*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Authorization:Bearer ..... Connection:keep-alive
Content-Length:66
Content-Type:text/plain;charset=UTF-8
Host:sandbox....net
Origin:127.0.0.1:9000
Referer:127.0.0.1:9000/session
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36
(KHTML, like Gecko) Chrome/35.0.1916.153 Safari/537.36 Request
Payload: {room:Kitchen, appliance:Refrigerator, floor:Main
Floor}

Answer 1

You can set the content type in the headers along with the Authorization header

$http({  
        method: "DELETE",  
        url: ".../v2/places/" + place.id + "/locations/remove",  
        data: location,  
        headers: {'Content-Type': 'application/json', Authorization: "Bearer " + rootServices.getToken() }  
    })  

Or you can set them app wide:

module.config(function($httpProvider) {
  //$http.defaults.headers.common.Authorization = 'Basic YmVlcDpib29w'
  $httpProvider.defaults.headers.delete = { 'Content-Type' : 'application/json' };
});

The docs state:

Setting HTTP Headers The $http service will automatically add certain HTTP headers to all requests. These defaults can be fully configured by accessing the $httpProvider.defaults.headers configuration object, which currently contains this default configuration:

$httpProvider.defaults.headers.common (headers that are common for all requests): Accept: application/json, text/plain, * / * $httpProvider.defaults.headers.post: (header defaults for POST requests) Content-Type: application/json $httpProvider.defaults.headers.put (header defaults for PUT requests) Content-Type: application/json To add or overwrite these defaults, simply add or remove a property from these configuration objects. To add headers for an HTTP method other than POST or PUT, simply add a new object with the lowercased HTTP method name as the key, e.g. `$httpProvider.defaults.headers.get = { 'My-Header' : 'value' }.

The defaults can also be set at runtime via the $http.defaults object in the same fashion. For example:

https://docs.angularjs.org/api/ng/service/$http

Answer 2

I found out the problem. We need to type "content-type" instead of "Content-Type". If i understand it, the lower case override the previous.

I will show an example:

$scope.deleteObject = function (object) {
    var objectId = object.id;
    var url = '/services/rest/deleteObject/' + objectId;
    var config = {
        headers: {
            'content-type': 'application/json'
        }
    };
    $http.delete(url, config)

    .then(function (response) {
        DO SOMETHING

    }, function (error) {
        DO SOMETHING
    });

};