raddevon
raddevon

Reputation: 3360

JSONP request gives 404 in Angular app

I'm trying to get some data from an API with a JSONP request, but I get a 404 every time. I would assume my URL is wrong, but I can hit the URL manually in Chrome and get the desired response. My $http.jsonp request always errors with a 404 showing up in my console.log in the error callback.

Here's the code that makes the request:

$scope.fetchDefaultLabel = function () {
      // This code will eventually set the label to the site name when the endpoint field blurs.
      // Currently not working properly.
      if ($scope.endpoint) {
        var baseUrl = $scope.endpoint.split('/')[2];
        var siteNameUrl = 'http://' + baseUrl + '/api/sitename.json?callback=JSON_CALLBACK';
        console.log(siteNameUrl);
        $http.jsonp(siteNameUrl)
          .success(function(data, status, headers, config) {
            $scope.label = data;
          })
          .error(function(data, status, headers, config) {
            console.log('Data: ' + data);
            console.log('Status: ' + status);
            console.log('Headers: ' + headers);
            console.log('Config: ' + config);
          });
      }
    };

Network panel of Chrome Dev Tools shows a 200 response for the request with the response body I would expect, but that's not getting to Angular for whatever reason.

Upvotes: 8

Views: 5421

Answers (2)

raddevon
raddevon

Reputation: 3360

After talking with some back-end developers, it appears the API I am using does not support JSONP. This is the reason I was getting a 404 on that request.

Upvotes: 5

Mahmal Sami
Mahmal Sami

Reputation: 709

can you provide the exact content of window.console.log(siteNameUrl) just before your ajax request and provide the result ?
Maybe try a siteNameUrl.toString() just in case it's a parsing problem
it seems that you're not requesting the exact same url...
Try even putting hard written the siteNameUrl you're using as siteNameUrl="www.someapi/api"

Upvotes: 1

Related Questions