What's wrong with below code? I keep getting following error. The response from ajax is plain text, for instance "Hello world". Does $http.get() expects json response?
angular.js:13550 SyntaxError: Unexpected token t in JSON at position 1 at Object.parse (native) at uc (.5.5/angular.min.js:17:36) at ac (.5.5/angular.min.js:91:229)
<html>
<head>
<link rel="stylesheet" href=".3.6/css/bootstrap.min.css">
<link rel="stylesheet" href=".1.0-rc2/angular-material.min.css">
<script src=".5.5/angular.min.js"></script>
<script src=".12.3.min.js"></script>
<script src=".5.5/angular-animate.min.js"></script>
<script src=".5.5/angular-aria.min.js"></script>
<script src=".5.5/angular-messages.min.js"></script>
<script src=".1.0-rc2/angular-material.min.js"></script>
<script>
var resourceApp = angular.module("resourceApp", [ "ngMaterial" ])
.controller('resourceController', function resourceController($scope, $http) {
$scope.processForm = function() {
$http.get("test")
.then(function(response) {
console.log(response.data);
});
};
});
</script>
</head>
<body ng-app="resourceApp" ng-controller="resourceController">
<button ng-click="processForm()">Submit</button>
<pre>{{response}}</pre>
</body>
</html>
What's wrong with below code? I keep getting following error. The response from ajax is plain text, for instance "Hello world". Does $http.get() expects json response?
angular.js:13550 SyntaxError: Unexpected token t in JSON at position 1 at Object.parse (native) at uc (https://ajax.googleapis./ajax/libs/angularjs/1.5.5/angular.min.js:17:36) at ac (https://ajax.googleapis./ajax/libs/angularjs/1.5.5/angular.min.js:91:229)
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn./bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="http://ajax.googleapis./ajax/libs/angular_material/1.1.0-rc2/angular-material.min.css">
<script src="https://ajax.googleapis./ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src="https://code.jquery./jquery-1.12.3.min.js"></script>
<script src="http://ajax.googleapis./ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script>
<script src="http://ajax.googleapis./ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>
<script src="http://ajax.googleapis./ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script>
<script src="http://ajax.googleapis./ajax/libs/angular_material/1.1.0-rc2/angular-material.min.js"></script>
<script>
var resourceApp = angular.module("resourceApp", [ "ngMaterial" ])
.controller('resourceController', function resourceController($scope, $http) {
$scope.processForm = function() {
$http.get("test")
.then(function(response) {
console.log(response.data);
});
};
});
</script>
</head>
<body ng-app="resourceApp" ng-controller="resourceController">
<button ng-click="processForm()">Submit</button>
<pre>{{response}}</pre>
</body>
</html>
- What's the data returned by your server? Hint: it's probably not (valid) JSON. – deceze ♦ Commented May 4, 2016 at 9:12
- yes, it is just plain text, updated the question – sidgate Commented May 4, 2016 at 9:13
-
Is your server setting the
Content-Typeresponse header to indicate JSON? – deceze ♦ Commented May 4, 2016 at 9:16 -
Yes, it was
application/json. But I changed it toplain/textand still see the same error – sidgate Commented May 4, 2016 at 9:18 - Answered below, check 1) Your AngularJS header configuration, 2) Your server configuration and 3) that "test" is a valid route in your server, that delivers a plain text. – Yassine Badache Commented May 4, 2016 at 9:27
1 Answer
Reset to default 2For your second question Not necessarily. You should check both in your server and your front-end configuration that you are actually allowed to receive plain text as a response.
The official $http documentation will help you about setting your header correctly, while I let you check for your server configuration as well.
For the first one
Is "test" a valid route ? It seems that $http tries to get "test" as a plain text, and not the resource which is stored behind "test", as the firt incorrect character is 't'. Otherwise (if it is a valid route), please refer on the above-mentioned answer.
EDIT
When calling $http (even in localhost), you must mention the full route to your resource. Here, you cannot directly call ("test"), it interprets it as a plain "test" request. Try calling:
$http.get('localhost:[your port]/test').then { ...what you need to do... });
SECOND EDIT
text/plain and plain/text makes a difference when configuringn, be careful ! This fixed the asker's problem.