given a call to this function with a given accountTypeUrl
this.deleteAccount = function (accountTypeId) {
var deleteurl= accountTypeUrl+"/"+accountTypeId;
console.log(deleteurl);
$http({
url: deleteurl,
method: 'DELETE',
headers: {"Content-Type": "application/json;charset=utf-8"}
}).then(function(res) {
console.log(res); // its not printing
}, function(error) {
console.log(error); // prints here
});
};
in Browser Chrome > F12 > Network : Response to the function call is showing “Success” but angular js is throwing error in console and prints
console.log(error); =>
SyntaxError: Unexpected token S in JSON at position 0
at JSON.parse (<anonymous>)
at oc (angular.min.js:14)
at Fe.e.defaults.transformResponse (angular.min.js:77)
at angular.min.js:76
at r (angular.min.js:7)
at Tc (angular.min.js:76)
at b (angular.min.js:78)
at angular.min.js:109
at h.$eval (angular.min.js:123)
at h.$digest (angular.min.js:120)
Soz, I should have looked at the code more carefully. I saw the error message SyntaxError: Unexpected token S in JSON... and figured the server was returning malformed JSON.
However, it seems you are sending a DELETE request to your server, but no request body (i.e. no data parameter). Could that be causing your issue? What happens if you remove the headers from the config object?
Or are you working with a backend framework that expects content-type for all HTTP verbs?
What does the URL look like? You shouldn’t really need to pass anything to it except the ID of whatever you want to delete. And if that is the case, you should be able to remove the JSON headers as you are not sending any JSON to the server.
data goes to the server and deletion works perfectly at server side from database.
However during response return the error is at front-end and angular is going to the error part here
function(error) {
console.log(error); // prints here
});
I’m stuck now to drill down the cause of the issue now
you may not need this RestService code but here is what happens at server side in my microservice
@RequestMapping(value={"/v1/{accountId}"}, method=RequestMethod.DELETE)
public ResponseEntity<?> delete(@PathVariable("accountId") String accountId) {
try {
ArrayList<Object> list = new ArrayList<Object>();
list.add(accountId);
service.delete(list);
return new ResponseEntity<String>("Success", HttpStatus.OK); // this retunrs perfectly to browser with Success in Debug mode
} catch (Exception e) {
e.printStackTrace();
return (new ResponseEntity<String>(ErrorCodes.SERVER_ERROR.getDescription(), HttpStatus.INTERNAL_SERVER_ERROR));
}
}
Not sure really. Hopefully, it’d work. However, you’re using an old Angular version and there have been a couple of issues around setting content-type headers for DELETE requests (example) in older versions.
But as I said, shooting in the dark at this point, I’m afraid (without a concrete example to reproduce).
If you’re asking me how I’d debug your problem, I’d isolate the error to the most minimal reproducible test case I can until you hone in on what is causing your issue. Fore example, you can try just returning a 200 response from the server, see if that helps. Also, you can use the Chrome Dev Tools to inspect the response. If you click on the specific response, you should be able to drill down and view the various headers, payload etc…
