MERN应用部署Heroku时API请求失败问题求助

• 本地环境可正常获取internet.bs API响应，但部署到Heroku后无法正常获取
• 已在后端.env文件配置所需参数，且完成CORS配置，仍无法定位问题

server.js代码 #

const express = require("express");
const path = require("path");
const bodyParser = require("body-parser");
const cors = require("cors");
const dotenv = require("dotenv");
const colors = require("colors");
const dbConnect = require("./database/dbConnect");

dotenv.config();

// *** ROUTES IMPORT ***
const usersRoutes = require("./routes/users-routes");
const ovhRoutes = require("./routes/ovh-routes");
const renewDomainsRoutes = require("./routes/renew-domain-routes");
const meRoutes = require("./routes/me-routes");
const internetBsRoutes = require("./routes/internetbs-routes");
const domainsRoutes = require("./routes/domains-routes");
const orderRoutes = require("./routes/order-routes");

// execute database connection
dbConnect();

const app = express();

app.use(bodyParser.json());
app.use(cors());

/**
 * ROUTES
 */
app.use("/api/users", usersRoutes); // => /api/users/...
app.use("/api/ovh", ovhRoutes); // => /api/ovh/...
app.use("/api/renew", renewDomainsRoutes);
app.use("/api/me", meRoutes);
app.use("/api/internetbs", internetBsRoutes);
app.use("/api/domains", domainsRoutes);
app.use("/api/order", orderRoutes);

app.use((req, res, next) => {
  throw new HttpError("Could not find this route.", 404);
});

app.use((error, req, res, next) => {
  if (res.headerSent) {
    return next(error);
  }
  res.status(error.code || 500);
  res.json({ message: error.message || "An unknown error occurred!" });
});

/**
 * DEPLOYMENT
 */

if (process.env.NODE_ENV === "production") {
  // Step 1:
  app.use(express.static(path.resolve(__dirname, "./client/build")));

  // Step 2:
  app.get("*", function (request, response) {
    response.sendFile(path.resolve(__dirname, "./client/build", "index.html"));
  });
}

app.listen(
  process.env.PORT || 5000,
  console.log(`Server is running on port ${process.env.PORT}`.blue.bold)
);

排查与解决方向 #

1. 检查Heroku环境变量配置

   • Heroku不会读取本地.env文件，需在应用设置的Config Vars中完整配置所有internet.bs所需的API密钥、用户名等参数，确认变量名和值与本地完全一致。

2. 验证Heroku依赖与构建配置

   • 确保package.json中包含heroku-postbuild命令，用于在Heroku上自动构建前端：

     "scripts": {
       "start": "node server.js",
       "build": "cd client && npm install && npm run build",
       "heroku-postbuild": "npm run build"
     }
     

   • 添加engines字段指定与本地一致的Node.js版本，避免依赖兼容问题：

     "engines": {
       "node": "16.x",
       "npm": "8.x"
     }
     

3. 排查路由拦截问题

   • 生产环境中app.get("*")会捕获所有GET请求返回index.html，确认前端API请求路径无拼写错误，且若为GET请求，后端路由需在静态文件配置前定义（当前代码已满足）。若API使用POST/PUT等方法，需确认后端路由正确处理对应请求方式。

4. 查看Heroku实时日志

   • 执行命令heroku logs --tail查看服务器实时日志，可直接获取具体错误信息（如API请求失败原因、环境变量未加载、数据库连接异常等），是定位问题的核心手段。

5. 优化CORS配置

   • 可尝试明确指定允许的前端域名，避免默认配置潜在问题：

     app.use(cors({
       origin: process.env.CLIENT_URL || "http://localhost:3000"
     }))
     

     同时在Heroku的Config Vars中设置CLIENT_URL为你的Heroku应用域名。

6. 确认internet.bs API访问权限

   • 部分API会限制访问IP，需确认Heroku的出站IP是否在internet.bs的允许访问列表中，或在API后台配置允许Heroku服务器访问。

内容的提问来源于stack exchange，提问作者Yass