加载资源失败：net::ERR_CONNECTION_REFUSED http://127.0.0.1:3000/api/categories

Question

我的 node.js 后端运行在端口 5000 上，我的 React 客户端运行在端口 3000 (http://localhost:3000) 上。 React 客户端在 package.json 代理中有以下 url：http://localhost:5000 (backend url)

我曾经在 baseurl http://localhost:3000 使用 axios 从客户端向后端发出 api 请求。代理执行了它的功能，cors没有问题。

在 app.js 的后端有以下代码块：

app.use(function (req, res, next) {
  // Website you wish to allow to connect
  res.setHeader('Access-Control-Allow-Origin', 'http://localhost:3000')

  // Request methods you wish to allow
  res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE')

  // Request headers you wish to allow
  res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type, Authorization')

  // Set to true if you need the website to include cookies in the requests sent
  // to the API (e.g. in case you use sessions)
  res.setHeader('Access-Control-Allow-Credentials', true)

  // Pass to next layer of middleware
  next()
})

现在我决定将我的站点移动到 VPS 服务器。我在那里安装了 nginx，这是我在位置块中的 /etc/nginx/sites-available/default 中写的内容。

location / {
                # First attempt to serve request as file, then
                # as directory, then fall back to displaying a 404.
                proxy_pass http://localhost:3000; #whatever port your app runs on
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }

使用 pm2 我运行我的 node.js 后端和 React 客户端。它们运行在与以前相同的端口上。

例如，我的服务器现在可以在 my-site.com 上使用。当您转到 url 时，它会打开我的客户端。到目前为止，一切都在按预期进行。但是，当我的客户端访问我的后端时，出现如下错误： GET http://127.0.0.1:3000/api/categories net::ERR_CONNECTION_REFUSED

你能告诉我如何修复它并让我的 api 请求被执行吗？

Answer 1

您的 React 代理可能不在 VPS 上运行。无论哪种方式，最好改用 Nginx，因为 React 代理仅供开发使用。

您可以配置 Nginx 以将对 /api 路径的请求转发到 Node.js 应用程序，就像您为 React 应用程序配置根路径一样。

location /api {
    proxy_pass http://localhost:5000;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
    proxy_set_header Host $host;
    proxy_cache_bypass $http_upgrade;
}

加载资源失败：net::ERR_CONNECTION_REFUSED http://127.0.0.1:3000/api/categories

Failed to load resource: net::ERR_CONNECTION_REFUSED http://127.0.0.1:3000/api/categories

nginx

node.js

reactjs