Question

HTML

    <!doctype html>
    <html lang="en" ng-app="phonecatApp">
    <head>
  <meta charset="utf-8">
  <title>WrikeAPI</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
 <script src="https://code.angularjs.org/1.4.0-beta.5/angular.js" data-semver="1.4.0-beta.5" data-require="angular.js@1.4.0-beta.5"></script>
  <script data-require="angular-route@1.4.0-beta.5" data-semver="1.4.0-beta.5" src="https://code.angularjs.org/1.4.0-beta.5/angular-route.js"></script>

<script>

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

 var client_id = "";
 var client_secret = "";
 var grant_type = "";
 var refresh_token = "";

wrikeApiControllers.controller('AccessToken', ['$scope', '$http',
  function($scope, $http) {
   $http.post('https://www.wrike.com/oauth2/token?client_id='+client_id+'&client_secret='+client_secret+'&grant_type='+ grant_type +'&refresh_token='+refresh_token).
      success(function(data, status, headers, config) {

        $scope.response = data;
      }).
      error(function(data, status, headers, config) {

      });

  }]);  


var phonecatApp = angular.module('phonecatApp', [
  'ngRoute',
  'wrikeApiControllers'
]);

phonecatApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/access', {
        templateUrl: 'display-access-token.html',
        controller: 'AccessToken'
      }).
      otherwise({
        redirectTo: '/access'
      });
  }]);


</script>
</head>
<body>

  <div ng-view></div>

</body>
</html>

这是我的display-access-token.html

      <ul >
    <div ng-repeat="access in response"  class="thumbnail">
      <p>{{response.access_token}}</p>
      <p>{{response.token_type}}</p>
      <p>{{response.expires_in}}</p>
      <p>{{response.refresh_token}}</p>
    </div>
  </ul>

当我使用网络浏览器或使用Chrome扩展程序邮递员访问wrike时，我会在发布后得到回应

    {
    "access_token": "UQldFEZJwifB3PEJWAsvasv3js1uoLk1GCq5ppMGgUijoz8gP46tBxeBd5ud51VGLFNlGjQw-N-N",
    "token_type": "bearer",
    "expires_in": 3599,
    "refresh_token": "8yRHuuzeeEsqE4o0Y1lJe02uhqgGlalxnl798aksCzFn7WxjEtS4iveFhBjEG349w7pDFm3m1sY-A-N"
}

但是当我使用AngularJS时我无法获得响应POST成功但我没有看到响应。我在网络浏览器中收到此消息＆＃34; Json.parse json数据的第1行第1列的数据意外结束＆＃34;

请帮忙吗？感谢

Answer 1

这段代码错了

<div ng-repeat="access in response"  class="thumbnail">
  <p>{{response.access_token}}</p>
  <p>{{response.token_type}}</p>
  <p>{{response.expires_in}}</p>
  <p>{{response.refresh_token}}</p>
</div>

因为您正在迭代数组＆＃34;响应＆＃34;并且对于每次迭代，您都有一个＆＃34; access＆＃34;对象，所以在每个＆＃39; p＆＃39;你必须使用的元素＆＃34;访问＆＃34;不是＆＃34;响应＆＃34;，像这样：

<div ng-repeat="access in response"  class="thumbnail">
  <p>{{access.access_token}}</p>
  <p>{{access.token_type}}</p>
  <p>{{access.expires_in}}</p>
  <p>{{access.refresh_token}}</p>
</div>

否则，如果预期数据不是数组，则不应使用ng-repeat，而只需使用响应对象

Answer 2

我不知道它是否有帮助，但您是否尝试过启用Cors？

$httpProvider.defaults.useXDomain = true;
$httpProvider.defaults.withCredentials = false;
delete $httpProvider.defaults.headers.common["X-Requested-With"];
$httpProvider.defaults.headers.common["Accept"] = "application/json";
$httpProvider.defaults.headers.common["Content-Type"] = "application/json";

Answer 3

当我从版本V1.2迁移到V1.4 AngularJS时，我遇到了同样的问题。在我的服务器（JAX-RS）中，我在注释中生成了JSON类型，并在响应中添加了一个String。我通过Produces（MediaType.TEXT_PLAIN）更改了Produces（MediaType.APPLICATION_JSON）。 AngularJS想要一个JSON格式，但他收到了一个字符串。

AngularJS json.parse在json数据的第1行第1列意外结束数据

3 个答案: