CORS问题随着前飞行的响应
我正在做一个Axios的电话,以获取博客文章,但是我面临CORS问题。我尝试了一切,但我不明白这个问题。这是我的代码:
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);
});
在我的 /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();
}
控制台中的问题是:
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.
I'm doing an axios call to get the blog articles, however I'm facing a CORS issue. I tried everything and I don't understand the problem. Here's my code:
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.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
在示例中,请在服务器上应用CORS验证,而不是前端:
JavaScript中的请求
这向您展示了如何在JavaScript中提出本政策允许的请求。
我们正在发送包含JSON的帖子请求,我们将包括我们的cookie。它与这些标头产生了请求:
用于PHP项目
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.
We're sending a POST request that contains JSON and we'll include our cookies. It produces a request with these headers:
For PHP Project