gpt4 book ai didi

javascript - 存在 “No ' Access-Control-Allow-Origin' header 的 5xx 或 4xx 错误”

转载 作者:搜寻专家 更新时间:2023-10-31 23:51:27 25 4
gpt4 key购买 nike

我的浏览器在 devtools 控制台中记录了以下消息:

No 'Access-Control-Allow-Origin' header is present on the requested resource.… The response had HTTP status code 503.

背景:我有两个应用程序。一个是连接到 Mongo 数据库的 Express Node 应用程序。另一个是基本的 Web 应用程序,它通过 Fetch API 向 Node 应用程序发出 POST 请求以从 Mongo 获取数据。

问题:虽然我在本地计算机上没有收到任何 CORS 错误,但在将我的基本 Web 应用程序部署到生产环境后,我会立即收到以下错误。向 Node 应用程序发出 POST 请求并向我提供以下信息的 Web 应用程序:

POST 请求似乎有效并且数据被保存到 Mongo 中,但是这个错误在 Heroku 中被标记为“严重错误”并且非常烦人。

我意识到我可以在 Fetch 中设置 no-cors 选项,但我认为这是必需的,因为我正在向与来源不同的 url 发出请求。对吧?

Express Node 应用程序代码

在我的 app.js 文件中,我设置了正确的 header 以确保其他应用程序可以从不同来源发出请求

应用程序.js

// Add headers so we can make API requests
app.use(function (req, res, next) {
res.setHeader('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
res.setHeader('Access-Control-Allow-Credentials', true);
next();
});

路由/api/api.js

router.post('/users/:url/upload-csv/:csv_name', (req, res) => {
let csv_name = req.params.csv_name;
let csv_string = csv_name+req.body.csv_string;

User.findOne({url: req.params.url})
.then((user) => {
if (user.csv_files.length === 0) {
user.csv_files.push(csv_string);
} else {
let foundExistingCSV = false;
for (var i = 0; i < user.csv_files.length; i++) {
if (user.csv_files[i].includes(csv_name)) {
foundExistingCSV = true;
user.csv_files[i] = csv_string;
break;
}
}
if (!foundExistingCSV) user.csv_files.push(csv_string);
}
user.markModified('csv_files');
user.save();

res.status(204);
})
.catch((err) => {
console.log(err);
res.status(400);
});
});

基本网络应用程序代码

POST 请求

实用程序.js

utils.exportToMongo = functions(table, name) {
var exportPlugin = table.getPlugin('exportFile');
var csv_string = exportPlugin.exportAsString('csv');

// Upload the CSV string and its name to Users DB
fetch(`${utils.fetchUserURL()}/upload-csv/${name}`, {
method: 'POST',
body: JSON.stringify({csv_string: csv_string}),
headers: new Headers({
'Content-Type': 'application/json',
Accept: 'application/json',
})
}).then((res) => {
return {};
}).catch((error) => {
console.log(error);
return {};
});
}

如何消除 503 错误?任何见解将不胜感激!

最佳答案

HTTP 5xx 错误表示服务器端发生了一些故障。或者它甚至可以指示服务器根本没有响应——例如,可能是您的后端尝试将请求代理到另一个端口上的服务器,但服务器甚至没有启动并监听预期的端口.

同样,4xx 表示请求存在一些问题,导致服务器无法处理它。

要确认,您可以尝试使用 curl、Postman 或其他工具发出相同的请求,并查看您是否收到请求的 2xx 成功响应,而不是 5xx4xx

无论如何,如果您在客户端看到 5xx4xx 错误,服务器端应该记录一些消息以指示失败的原因和原因。因此,要确定是什么触发了 5xx/4xx 错误,请检查服务器日志以查找服务器在发送错误之前记录的消息。

就 CORS 错误消息而言,预计在大多数情况下,对于 5xx4xx 错误,服务器不会添加 Access-Control -Allow-Origin 响应 header 到响应;相反,服务器很可能只会为 2xx3xx(重定向)响应发送该 header 。

因此,如果您解决了 5xx/4xx 错误的原因,以便获得成功响应,您可能会发现您的 CORS 配置已经正常工作并且你没有什么可解决的了。

关于javascript - 存在 “No ' Access-Control-Allow-Origin' header 的 5xx 或 4xx 错误”,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45356494/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com