2013-04-24 65 views
52

角不加入正確的內容類型選項發送,我嘗試下面的命令:

$http({ 
    url: "http://localhost:8080/example/teste", 
    dataType: "json", 
    method: "POST", 
    headers: { 
     "Content-Type": "application/json" 
    } 
}).success(function(response){ 
    $scope.response = response; 
}).error(function(error){ 
    $scope.error = error; 
}); 

上面的代碼生成以下http請求:

POST http://localhost:8080/example/teste HTTP/1.1 
Host: localhost:8080 
Connection: keep-alive 
Content-Length: 0 
Cache-Control: no-cache 
Pragma: no-cache 
Origin: http://localhost:8080 
User-Agent: Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.64 Safari/537.31 
Content-Type: application/xml 
Accept: application/json, text/plain, */* 
X-Requested-With: XMLHttpRequest 
Referer: http://localhost:8080/example/index 
Accept-Encoding: gzip,deflate,sdch 
Accept-Language: pt-BR,pt;q=0.8,en-US;q=0.6,en;q=0.4 
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3 
Cookie: JSESSIONID=C404CE2DA653136971DD1A3C3EB3725B 

正如你所看到的,而不是「application/json」,內容類型是「application/xml」。我在這裏錯過了什麼嗎?

回答

79

您需要在請求中包含正文。否則,Angular刪除內容類型標題。

data: ''添加到參數$http

+3

但如果我要發送的對象數據是什麼?我正在使用ASP.NET通用HTTP處理程序,出於某種原因,'context.Request.Params [「formData」]'不起作用,但是一個StackOverflow文章引導我使用'string json = new StreamReader(context。 Request.InputStream).ReadToEnd();'這是可行的,但我不完全放心使用它,因爲我寧願按名稱訪問提交的請求參數值。 – 2015-04-13 04:23:03

+1

上帝這是一個救星!這是默認的HTTP協議行爲還是Angular $ http行爲? – jchnxu 2015-08-16 09:24:50

+0

對於任何使用[Restangular](https://github.com/mgonto/restangular)的人,以下是如何實施此解決方案的示例:https://gist.github.com/sscovil/3bd0da1d98397213df54 – 2015-09-11 14:23:17

26
$http({ 
    url: 'http://localhost:8080/example/teste', 
    dataType: 'json', 
    method: 'POST', 
    data: '', 
    headers: { 
     "Content-Type": "application/json" 
    } 

}).success(function(response){ 
    $scope.response = response; 
}).error(function(error){ 
    $scope.error = error; 
}); 

請嘗試這樣。

+2

恐怕它在Angular 1.3.14中不起作用,如果沒有'data','Content-Type'就會被移除。空數據參數解決了這個問題,雖然... – IProblemFactory 2015-04-24 13:24:00

+0

非常奇怪!即使對於GET請求,我也必須提供數據:''字段。儘管我們都知道GET不應該有身體!當沒有數據提供時,爲什麼angularjs會剝離內容類型的應用程序/頭文件? – agpt 2016-10-17 07:47:46

1

太棒了!上面給出的解決方案爲我工作。遇到與GET調用相同的問題。

method: 'GET', 
data: '', 
headers: { 
     "Content-Type": "application/json" 
} 
+1

請爲您的代碼片段添加一些格式。並且更好地解釋自己,以避免倒票 – simonmorley 2015-12-11 11:43:53

+0

GET請求不能有一個正文(http://stackoverflow.com/a/983458/2416700)所以Content-Type在這種情況下毫無意義 – Evgeny 2016-01-14 09:43:05

+0

這是真的GET請求不能有一個正文,但當提供數據爲空字符串時很奇怪,那麼只有內容類型被採用,其他方式angularjs剝離該標題。 ! – agpt 2016-10-17 07:46:41

3
  $http({ 
       method: 'GET', 
       url:'/http://localhost:8080/example/test' + toto, 
       data: '', 
       headers: { 
        'Content-Type': 'application/json' 
       } 
      }).then(
       function(response) { 
        return response.data; 
       }, 
       function(errResponse) { 
        console.error('Error !!'); 
        return $q.reject(errResponse); 
       } 
0

爲了表明如何將「內容類型」頭動態地添加到每一個POST請求的示例。在可能的情況下,我傳遞POST參數作爲查詢字符串,這是通過使用transformRequest完成的。在這種情況下,它的值是application/x-www-form-urlencoded

// set Content-Type for POST requests 
angular.module('myApp').run(basicAuth); 
function basicAuth($http) { 
    $http.defaults.headers.post = {'Content-Type': 'application/x-www-form-urlencoded'}; 
} 

然後從請求方法攔截之前返回配置對象

// if header['Content-type'] is a POST then add data 
'request': function (config) { 
    if (
    angular.isDefined(config.headers['Content-Type']) 
    && !angular.isDefined(config.data) 
) { 
    config.data = ''; 
    } 
    return config; 
} 
1

在情況下,它的任何人是有用的。對於AngularJS 1.5倍,我想設置CSRF所有請求,我發現,我這樣做的時候:

$httpProvider.defaults.headers.get = { 'CSRF-Token': afToken }; 
$httpProvider.defaults.headers.put = { 'CSRF-Token': afToken }; 
$httpProvider.defaults.headers.post = { 'CSRF-Token': afToken }; 

角刪除內容類型,所以我不得不補充一點:

$httpProvider.defaults.headers.common = { "Content-Type": "application/json"}; 

否則我得到的415媒體類型錯誤。

所以我這樣做是爲了配置所有請求我的應用程序:

angular.module("myapp.maintenance", []) 
    .controller('maintenanceCtrl', MaintenanceCtrl) 
    .directive('convertToNumber', ConvertToNumber) 
    .config(configure); 

MaintenanceCtrl.$inject = ["$scope", "$http", "$sce", "$window", "$document", "$timeout", "$filter", 'alertService']; 
configure.$inject = ["$httpProvider"]; 

// configure the header tokens for CSRF for http operations in this module 
function configure($httpProvider) { 

    const afToken = angular.element('input[id="__AntiForgeryToken"]').attr('value'); 

    $httpProvider.defaults.headers.get = { 'CSRF-Token': afToken }; // only added for GET 
    $httpProvider.defaults.headers.put = { 'CSRF-Token': afToken }; // added for PUT 
    $httpProvider.defaults.headers.post = { 'CSRF-Token': afToken }; // added for POST 

    // for some reason if we do the above we have to set the default content type for all 
    // looks like angular clears it when we add our own headers 
    $httpProvider.defaults.headers.common = { "Content-Type": "application/json" }; 

}