HTML 中嵌入的 javascript 中的错误 - 对预检请求的响应未通过访问控制检查：它没有 HTTP 正常状态

问：

我正在做一个PoC。我在 HTML 页面中添加了以下 javascript 代码。此函数在单击按钮时执行，但由于 CORS 问题，它无法在控制台中记录响应。

function showText() {
  var a = "test";
  let btn = document.getElementById('desc');
  btn.innerHTML = a;

  let xhr = new XMLHttpRequest();

  var url = 'https://json.freeastrologyapi.com/planets';
  let body = '{"year": 2001,"month": 10,"date": 26,"hours": 16,"minutes": 50,"seconds": 0,"latitude": 23.259933,"longitude": 77.412613,"timezone": 5.5,"settings": {"observation_point": "topocentric","ayanamsha": "lahiri"}}';

  xhr.open("POST", url);

  xhr.onreadystatechange = function () {
    if (this.readyState == 4 && this.status == 200) {
      console.log(this.responseText);
    }
  }

  xhr.setRequestHeader("Content-type", "application/json");
  xhr.setRequestHeader("x-api-key", "API-TOKEN");
  xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
  xhr.send(body);
}

错误-

Access to XMLHttpRequest at 'https://json.freeastrologyapi.com/planets' from origin 'null' has been blocked by CORS policy: 
Response to preflight request doesn't pass access control check: It does not have HTTP ok status.