【问题标题】:Angular $http.post not returning XMLAngular $http.post 不返回 XML
【发布时间】:2015-03-16 20:56:54
【问题描述】:

我正在尝试使用 Angular 调用 Web 服务,但运气不佳。该服务接受一个没有 POST 正文的 POST 请求,并返回 XML。我可以确认该服务适用于原始 XMLHttpRequest 调用:

var xhr = new XMLHttpRequest();

xhr.onreadystatechange = function(){
  if(xhr.readyState == 4)
    console.log(xhr.responseText); // Returns data
}

xhr.open("POST", "https://api.bmreports.com/BMRS/MessageListRetrieval/v1/?APIKey=9eu73tsryf1sons&ParticipantId=INNOGY01&PublicationFrom=1970-01-01&PublicationTo=3000-01-01&ServiceType=XML", true);

xhr.send(null);

使用 jQuery:

$.ajax({
  url: 'https://api.bmreports.com/BMRS/MessageListRetrieval/v1/?APIKey=9eu73tsryf1sons&ParticipantId=INNOGY01&PublicationFrom=1970-01-01&PublicationTo=3000-01-01&ServiceType=XML',
  type: "POST",
  success: function(data){
    console.log(data); // Returns data
  },
  error: function (hxr, status, errorThrown){
    console.log(status);
  }
});

但是,当我尝试使用 Angular 的 $http 服务时,我没有得到任何回报:

angular.module('TestApp',[])
.controller('TestController', function($scope, $http){
    $http({
        method: "POST",
        url: 'https://api.bmreports.com/BMRS/MessageListRetrieval/v1/?APIKey=9eu73tsryf1sons&ParticipantId=INNOGY01&PublicationFrom=1970-01-01&PublicationTo=3000-01-01&ServiceType=XML'
    }).success(function(data, status, headers, config){
        console.log("data:");
        console.log(data); // Returns null
    }).error(function(data, status, headers, config){
        console.log("error status:");
        console.log(status); // No errors returned      
    })
})

编辑:使用 $http.post 快捷方式:

angular.module('TestApp',[])
.controller('TestController', function($scope, $http){
    $http.post(
        'https://api.bmreports.com/BMRS/MessageListRetrieval/v1/?APIKey=9eu73tsryf1sons&ParticipantId=INNOGY01&PublicationFrom=1970-01-01&PublicationTo=3000-01-01&ServiceType=XML'
    ).success(function(data, status, headers, config){
        console.log("data:");
        console.log(data);
    }).error(function(data, status, headers, config){
        console.log("error status:");
        console.log(status);        
    })
})

请注意,$http.post 快捷方式有第二个数据参数,但我没有要传递的数据。如果我将参数包含为 null,Chrome 会说:

Access-Control-Allow-Headers 不允许请求标头字段 Content-Type

由于$http.post这个快捷方式没有报错漏掉data参数,所以我是故意漏掉的。

我需要能够在没有数据的情况下进行 POST 调用,就像使用原始 XMLHttpRequest 调用或 jQuery 的 ajax 方法一样。可能出了什么问题?谢谢!

(注意,API 是公开的,所以不用担心我发布的 API 密钥。它是有效的 API 密钥,只有在这个问题开放时我才会保持活动状态)

【问题讨论】:

  • post的语法是$http.postdocs.angularjs.org/api/ng/service/$http#!
  • 感谢 jcubic。这与我是使用 $http({}) 样式还是 $http.post() 快捷方式无关,但无论如何我已经为后代更新了这个问题。感谢您的帮助。

标签: javascript angularjs


【解决方案1】:

Angular 默认期望从您的服务器获取 JSON,您可以通过添加来更改它

var app = angular.module('app', []);

app.controller('homeCtrl', function($scope, $http) {

  $scope.xml = "";


  $http({
    method: "POST",
    url: 'https://api.bmreports.com/BMRS/MessageListRetrieval/v1/?APIKey=9eu73tsryf1sons&ParticipantId=INNOGY01&PublicationFrom=1970-01-01&PublicationTo=3000-01-01&ServiceType=XML',
    headers: {
      "Accept": "application/xml"
    }
  }).success(function(data, status, headers, config) {
    console.log("data:");
    console.log(data); // Returns null
    $scope.xml = data;
  }).error(function(data, status, headers, config) {
    console.log("error status:");
    console.log(status); // No errors returned      
  })


});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app">
  <div ng-controller="homeCtrl">
   {{xml}}
  </div>
</div>

根据您的要求

【讨论】:

  • 谢谢西尔韦斯特!所以这实际上只是添加标题的情况!太棒了 - 再次感谢 :)
猜你喜欢
  • 2018-07-01
  • 1970-01-01
  • 1970-01-01
  • 2019-03-04
  • 2016-07-03
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多