Wikipedia: why isn't my getJSON() call working?

Wikipedia: why isn't my getJSON() call working?
0

#1

No errors coming up in console. When I go to the URL using my browser I see the info that I want, so the URL must be right, but for some reason the function within the getJSON() parameters isn’t running, so something isn’t working right.


#2

Your current API url is not set up for JSONP, so add “&callback=?” to the end of the query string.

I also found that your console.log('hello') doesn’t fire even when you use the correct API endpoint - but if you replace that with console.log(JSON.stringify(json)), you will see the actual data you are after.

One other thing to consider - currently, pressing enter instead of clicking the search button has a behaviour you don’t want - so reconsider how you submit that…


#3

Hey Jackson, thanks for your response.

I made the changes you suggested and still am not getting the code inside my function to run, whether I’m printing “hello” or my JSON data. Am I missing something about how JSON / API calls work? I am pretty new to this stuff. I don’t understand why putting “&callback=?” at the end of my query string sets my return data format to JSON instead of JSONP, isn’t that what “format=json” does?

I’m going to work on the pressing-enter situation once I get this part figured out, thanks for pointing that out.


#4

I’m not sure what the issue is, but inputting the same search term twice does work…

i.e. Type ‘microsoft’ in the search bar -> Click search…nothing. Type microsoft again -> click search -> Glorious stream of JSON in the console…

Weird!

The Wikipedia API is notoriously glitchy - which is why I just gave you the answer instead of helping you gradually find it! Normally, a public API would be set up to allow cross origin requests, or they insist on you requesting JSONP instead.

Wikipedia kinda go down the second route, but they expect you to request the format “JSON” even though &callback=? means you are actually requesting the JSONP version.

It’s nutty - don’t overthink it - most APIs behave better :slight_smile:


#5

Ok so I’ve been messing around with this a lot and am STILL having the problem of not getting any return data from my GET call. Sometimes I’ll change things around and get a CORS error, but as soon as I fix that I just don’t get anything back at all.

I just changed to a .ajax() call instead of a .getJSON() wondering if that would somehow help me out but I don’t think anything is acting differently. I’ve been messing around with my URL and have tried different iterations of it from the sandbox, all with the same eventual issue of not returning JSON info in my callback function. Also just put a return statement into my callback function, not sure whether it needs it? Either way the console.log() isn’t happening


#6

I’ll take a proper look later. I remember when I looked at your code before that we had both used slightly different API endpoints.

IIRC, yours required you to do some odd data wrangling (serialising, I think?), whereas mine didn’t…not sure if that might be causing you issues?

I’ll grab my API string off codepen and edit this post to include it - you may find it more intuitive?

Edit:

var url = "https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=" + query + "&format=json&callback=?";

#7

yeah, this is exactly what I’ve been using :confused:

Thanks though. Let me know if you see anything in my code I should change.