Wikipedia CORS api problem

Hi, I’m working on the wikipedia viewer and whenever I try to access the api, I get an error in the console about the origin and not being allowed to use the page. I tried adding “origin=*” to the url which seems to have worked for some people with a similar issue but it hasn’t helped for me. I’m not even that far along the project, I’m just trying to load the search term and print it out on the console but I can’t even do that. Here is my project so far,

https://codepen.io/amthomps/pen/ZXEybV?editors=0111

Your form refreshes the page on submit. You can prevent this by adding an event parameter to your click handler, then add event.preventDefault().

$('...').click(function(event) {
  event.preventDefault();
  // ...
});

Better yet, instead of binding an event handler to the submit button on click, bind it to the form itself. That way, your code will work if the submit button is clicked or the Enter key is pressed.

$('#form-id').on('submit', function(event) {
  event.preventDefault();
  // ...
});

About your URL, you should use https://en.wikipedia.org/ instead of https://wikipedia.org/. Otherwise you’ll have a CORS issue.

1 Like