如何从 nextjs 应用程序连接到同一 IP 地址上的 api 服务器

Question

我正在使用 Express 后端/服务器构建 nextjs 应用程序。 使用 ubuntu 在 vps 上设置应用程序。 应用程序加载，但我不知道如何连接到后端服务器。

我有客户端和服务器文件夹，但现在我没有域，仅使用 IP 地址。 我还有在 aws ec2 实例上运行的服务器，我可以使用 ec2 IP 地址连接到该服务器，但是当我尝试使用本地主机的 IP 地址进行连接时，出现连接超时或连接被拒绝的情况。

这是我的可用站点/default.conf：

server {
     listen 80;
     server_name my_ip_address;
     location / {
          proxy_pass http://localhost:3000;
          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;
     }
}

在客户端的 .env 文件中，我尝试将 NEXT_PUBLIC_API_BASE_URL 设置为 http://localhost:3000、http://localhost:8000（服务器设置为在端口 8000 上运行）和 http://my_ip_address。

我猜我必须更新 default.conf 文件中的某些内容，但我不知道该怎么做。

Answer 1

要解决将 Next.js 应用程序连接到 VPS 或 AWS EC2 实例上的 Express 后端的问题：

1. 确保 Express 正在侦听所有接口：在 Express 服务器中，将其绑定到

   0.0.0.0

   ，以便可以从外部客户端访问它：

   app.listen(port, '0.0.0.0');
   

2. 检查防火墙和安全组：

   • 在 Ubuntu VPS 上，打开所需的端口（例如，

     3000

     ）：

     sudo ufw allow 3000
     

   • 在 AWS EC2 上，确保安全组允许您正在使用的端口上的入站流量（例如，

     3000

     ）。

3. 如果 Next.js 应用程序和后端位于不同的来源，请在 Express 中启用 CORS：

   const cors = require('cors');
   app.use(cors());
   

4. 在 Next.js 中使用正确的 IP：确保您的 Next.js 客户端正在向 EC2 或 VPS 的公共 IP 发出请求（例如，

   http://<your-ip>:3000

   ）。

5. 测试连接：

   • 在服务器上，使用

     curl

     或

     wget

     测试后端：

     curl http://localhost:3000/api/endpoint
     

   • 从外部计算机测试是否可以通过公共 IP 访问后端。