在我的React应用程序中进行API调用时仍然出现503错误

Question

我正在尝试让我的React-Redux应用程序通过Axios与我部署的Heroku API进行通信。

当我尝试通过Axios向我的Heroku服务器发出POST请求时，我在Chrome开发者工具的控制台中收到此错误消息：

正如您在屏幕截图中看到的那样，我正在获得＆＃34; No＆＃39; Access-Control-Allow-Origin＆＃39;标头出现在请求的资源上。＆＃34;以及错误状态代码503.

我觉得奇怪的是我的source .bashrc请求被解雇了两次。这是正常的吗？

以下是我的后端代码中/register文件中的配置，用于启用跨域请求：

app.js

这是Axios代码，它在我的前端对服务器进行API调用：

app.use(function (req, res, next) {
    res.header("Access-Control-Allow-Origin", '*');
    res.header("Access-Control-Allow-Credentials", true);
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,PATCH,OPTIONS');
    res.header("Access-Control-Allow-Headers", "Access-Control-Allow-Headers,Access-Control-Allow-Methods,Access-Control-Allow-Origin,Origin,X-Auth,X-Requested-With,Content-Type,Accept,content-type,application/json,x-auth,Access-Control-Request-Method,Access-Control-Request-Headers");
    next();
});

我的代码有什么问题吗？这是我在Github上的front-end和back-end代码。

如果相关，我的后端部署在Heroku上。另外，我确实尝试使用cors npm包，但它没有用。

Answer 1

我愿意打赌你从heroku堆栈中获取503，因为你的后端存在一些问题。 （也许超时？）显然，Heroku堆栈不会添加交叉原点标头，这就是为什么你在JS控制台中看到交叉原点错误的原因。你可以发布你的服务器日志吗？