AngularJS json.parse unexpected end of data at line 1 column 1 of the json data



    <!doctype html>
    <html lang="en" ng-app="phonecatApp">
  <meta charset="utf-8">
  <link rel="stylesheet" href="">
 <script src="" 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=""></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) {
   $''+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', [

  function($routeProvider) {
      when('/access', {
        templateUrl: 'display-access-token.html',
        controller: 'AccessToken'
        redirectTo: '/access'


  <div ng-view></div>


and this is my display-access-token.html

      <ul >
    <div ng-repeat="access in response"  class="thumbnail">

when I accessing wrike using my web browser or using Chrome extension postman I get response after posting like this

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

but when I am using AngularJS i can't get response POST is successful but I don't see response. I get this message in web browser "Json.parse unexpected end of data at line 1 column 1 of the json data"

Any help please ? Thanks

Problem courtesy of: Zvonimir Tokic


This piece of code is wrong

<div ng-repeat="access in response"  class="thumbnail">

Because you're iterating over the array "response" and for each iteration you have an "access" object, so inside each 'p' element you have to use "access" not "response", like this:

<div ng-repeat="access in response"  class="thumbnail">

Otherwise, if the expected data is not an array, you should not use ng-repeat but simply use the response object

Solution courtesy of: Alessio


I don't know if it helps, but have you tried enabling 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";
Discussion courtesy of: aitorllj93

I had the same problem when I migrated from version V1.2 to V1.4 AngularJS. In my server (JAX-RS), I produced JSON type in annotation and I put on a String in response. I changed the Produces(MediaType.APPLICATION_JSON) by Produces( MediaType.TEXT_PLAIN). AngularJS wanted a JSON format but he received a String.

Discussion courtesy of: sgrillon

This recipe can be found in it's original form on Stack Over Flow.