JSONP request gives 404 in Angular app

Question

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.

have you seen this already? stackoverflow.com/questions/19916362/… — klode
– klode, Commented Jun 6, 2014 at 1:46
@klode I have seen that. It may be that the API doesn't support JSONP requests. Is that possible? — raddevon
– raddevon, Commented Jun 6, 2014 at 16:49

raddevon · Accepted Answer · 2014-07-22 17:26:33Z

5

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.

answered Jul 22, 2014 at 17:26

raddevon

3,3604 gold badges46 silver badges52 bronze badges

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

1 Comment

chrismarx Over a year ago

this is really a terrible way for angular to handle this kind of error. giving a 404 is confusing. how about it just says, "hey, there's no valid function to call in the script" and we'd all be on our merry way making sure the response is valid for jsonp

Mahmal Sami · Accepted Answer · 2014-06-06 01:31:19Z

1

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"

answered Jun 6, 2014 at 1:31

Mahmal Sami

7097 silver badges12 bronze badges

2 Comments

raddevon Over a year ago

I'm not sure I can make the URL public, but I did try hard-coding a value into the variable. It doesn't seem to work that way either. At this point, I believe the API does not support JSONP requests. Is that possible? Do you have to intentionally add JSONP support to an API?

Mahmal Sami Over a year ago

Yes, you'll need a different implementation : [...] 'Note that for JSONP to work, a server must know how to reply with JSONP-formatted results' en.wikipedia.org/wiki/JSONP

Collectives™ on Stack Overflow

JSONP request gives 404 in Angular app

2 Answers 2

1 Comment

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related