AngularJS $http GET request to local JSON file returns SyntaxError: Unexpected token ]

Question

I'm trying to make a simple GET request to a JSON file located within my project directory and keep receiving the following: SyntaxError: Unexpected token ]

I don't see any syntactical issues with my JavaScript or JSON. The path to the JSON is correct gives me a 304 response. My JavaScript and JSON are fairly straight-forward:

JavaScript:

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

// controllers
app.controller('myController', function($scope, $http){

  $scope.data = null;

  $http.get('data.json').success(function(data){

    $scope.data = data;
    console.log($scope.data);
  });
});

JSON:

{
 "data": [
  {
    "title": "Test 1",
    "description": "Fusce vulputate eleifend sapien."
  },
  {
    "title": "Test 2",
    "description": "Vivamus laoreet."
  },
  {
    "title": "Test 3",
    "description": "Quisque ut nisi."
  },
 ]
}

What is preventing me from retrieving the data from within my JSON file?

it is not a valid json, there is an extra comma after the last element in data array — MarkoCen
– MarkoCen, Commented Apr 26, 2016 at 21:09

carlcheel · Accepted Answer · 2016-04-26 21:09:38Z

3

You have an extra comma at the end of your JSON:

{
 "data": [
  {
    "title": "Test 1",
    "description": "Fusce vulputate eleifend sapien."
  },
  {
    "title": "Test 2",
    "description": "Vivamus laoreet."
  },
  {
    "title": "Test 3",
    "description": "Quisque ut nisi."
  }, <<<< HERE
 ]
}

answered Apr 26, 2016 at 21:09

carlcheel

6216 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ariel Weinberger · Accepted Answer · 2016-04-26 21:18:29Z

2

Normally, in JavaScript, adding an extra comma to an array/object won't cause any problems (in the code editor, for example), even though it's not best practice.

But since you're using this JSON in a request, the JSON syntax must be correct.

Removed a comma at the end of the array containing objects.

{
 "data": [
  {
    "title": "Test 1",
    "description": "Fusce vulputate eleifend sapien."
  },
  {
    "title": "Test 2",
    "description": "Vivamus laoreet."
  },
  {
    "title": "Test 3",
    "description": "Quisque ut nisi."
  }
 ]
}

answered Apr 26, 2016 at 21:18

Ariel Weinberger

2,3214 gold badges27 silver badges49 bronze badges

Collectives™ on Stack Overflow

AngularJS $http GET request to local JSON file returns SyntaxError: Unexpected token ]

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related