Cors issue with response to preflight request-CodePudding

I'm doing an xios call to get the blog articles, however i'm facing an CORS issue, i tried everything and i don't understand the problem.

 axios({
    method: "POST",
    url: process.env.REACT_APP_API_URL   '/pages/articles',
    headers: { 'Content-Type': 'application/json;charset=UTF-8', "Access-Control-Allow-Origin": "*", "Accept": "application/json" },
    data: {
    country: localStorage.getItem("locale")
 }
 }).then(result => {
    setPosts(result.data.json.articles);
 });

In my /config/bootstrap.php

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, Authorization');
header("Access-Control-Allow-Credentials: true");
header('Content-Type: application/json');
$method = $_SERVER['REQUEST_METHOD'];
if ($method == "OPTIONS") {
    header('Access-Control-Allow-Origin: *');
    header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method,Access-Control-Request-Headers, Authorization");
    header("HTTP/1.1 200 OK");
    die();
}

The problem in the console is:

Access to XMLHttpRequest at 'https://api.mysite.fr/pages/articles' from 
origin 'https://mysite.fr' has been blocked by CORS policy: Response to 
preflight request doesn't pass access control check: It does not have 
HTTP ok status.

CodePudding user response：

Please apply CORS validation on the server it needs to be server-side not front-end for the example: The request in JavaScript This shows you how to make a request in JavaScript that is allowed by this policy.

var http_request;
http_request = new XMLHTTPRequest();
http_request.onreadystatechange = function () { /* .. */ };
http_request.open("POST", "process.env.REACT_APP_API_URL   '/pages/articles'");
http_request.withCredentials = true;
http_request.setRequestHeader("Content-Type", "application/json");
http_request.send({ 'request': "authentication token" });

We're sending a POST request that contains JSON and we'll include our cookies. It produces a request with these headers:

Origin: https://mysite.fr
Access-Control-Request-Method: POST
Access-Control-Request-Headers: Content-Type