How to solve the problem of some astronauts' names leading to disambiguation pages on Wikipedia

I have discovered two things can go wrong with this application, depending on who is in outer space and what kind of wikipedia page that person has.

1: When we're building a URL using the name of an astronaut, that URL can some times lead to a disambiguation page, instead of the page of the astronaut.

2: The person's page lacks a photograph

In both cases, the result is an empty box being rendered on the page.

I solved problem number 2 by adding an additional condition to the if statement in generateHTML, like this:

The original:

if (data.type === 'standard')

My changed version:

if (data.type === 'standard' && data.thumbnail != undefined)

This makes it so that if there is no photograph, then the else block is entered, which creates a box with a placeholder image, and things work out. I even get some wikipedia information in the box.

However, I could not solve problem number 1. Astronauts whose names lead to disambiguation pages also caused an undefined data.thumbnail, just like astronauts whose pages lacked photographs. I was working on the problem, but then the astronaut who was in outer space who caused this issue returned to Earth, and with no astronaut whose name lead to a disambiguation page, I could not test my solutions.

It's worth mentioning that I did not try my solution to problem number 2, on problem number 1. That astronaut left space before I did that, so I don't know whether it would have worked, but I suspect that it wouldn't have.

What solutions do you think that I could have gone for? If this problem returns in the future, and you solve it, please tell me how you did it here. I'll be even more grateful if you can solve both problems.

I'm pretty sure that part of the solution is to 1: Detect that we are on a disambiguation page 2: Change the URL that we send a request to, by adding (cosmonaut), _(astronaut), or _(taikonaut) to the end. For example, this disambiguation page: https://en.wikipedia.org/wiki/Sergey_Korsakov would become this cosmonaut page: https://en.wikipedia.org/wiki/Sergey_Korsakov(cosmonaut)

I don't know how to do this. I also don't know how to differentiate between cosmonauts, astronauts, and taikonauts.

Also, my first solution was to simply not render a box for any astronaut who had any sort of issue, but I don't like that "solution" as it removes potential content that should be included.

For reference, here is the original code that the instructor wrote, in callback.js (without my tiny change):

const astrosUrl = 'http://api.open-notify.org/astros.json';
const wikiUrl = 'https://en.wikipedia.org/api/rest_v1/page/summary/';
const peopleList = document.getElementById('people');
const btn = document.querySelector('button');

// Make an AJAX request
function getJSON(url, callback) {
  const xhr = new XMLHttpRequest();
  xhr.onreadystatechange = () => {
    if(xhr.readyState === 4) {
      if (xhr.status === 200) {
        let data = JSON.parse(xhr.responseText);
        callback(data);
      }
    }
  };
  xhr.open('GET', url);
  xhr.send();
}

// Generate the markup for each profile
function generateHTML(data) {
  btn.style.display = "none";
  const section = document.createElement('section');
  peopleList.appendChild(section);

  // Check if request returns a 'standard' page from Wiki
  if (data.type === 'standard') {
    section.innerHTML = `
      <img src=${data.thumbnail.source}>
      <h2>${data.title}</h2>
      <p>${data.description}</p>
      <p>${data.extract}</p>
    `;
  } else {
    section.innerHTML = `
      <img src="img/profile.jpg" alt="ocean clouds seen from space">
      <h2>${data.title}</h2>
      <p>Results unavailable for ${data.title}</p>
      ${data.extract_html}
    `;
  }
}


btn.addEventListener("click", () => 
{
 getJSON(astrosUrl, (json) => 
 {
   json.people.map(person => 
   {
     getJSON(wikiUrl + person.name, generateHTML);
   });
 });
});