MERN应用部署至Heroku后Axios API调用失效返回503错误如何解决

问题排查与解决方法 #

1. 启动脚本配置错误
   你package.json里的start脚本使用了nodemon，而nodemon属于开发依赖，Heroku生产环境默认不会安装devDependencies里的包，会直接导致服务启动失败返回503。
   解决方式：把start脚本修改为"start": "node app.js"，生产环境用原生node启动服务。

2. 环境变量未配置
   代码里使用了process.env.MONGO_URI读取MongoDB连接地址，本地运行时依赖.env文件，但Heroku不会自动读取本地的.env文件，未在Heroku后台配置对应环境变量会导致MongoDB连接失败，服务无法正常处理请求。
   解决方式：进入Heroku对应应用后台，选择「Settings」-「Config Vars」，添加MONGO_URI的键，值填写你的MongoDB连接串。同时确认app.js开头有引入dotenv配置：require('dotenv').config()，确保本地和生产环境都能正常读取环境变量。

3. MongoDB IP白名单限制
   如果你使用Mongo Atlas云数据库，默认只允许白名单内的IP访问，本地运行时你添加了本地IP到白名单，但Heroku的服务器IP是动态分配的，不在白名单内会导致数据库连接失败。
   解决方式：登录Mongo Atlas后台，进入对应数据库的「Network Access」设置，添加IP地址0.0.0.0/0允许所有IP访问，或者配置Heroku固定IP后单独添加到白名单。

4. 异常处理不完善导致请求超时
   当前你的接口异常逻辑只打印了服务端日志，没有给前端返回响应，会导致请求超时被Heroku返回503。建议在接口的catch块中添加错误响应：

   .catch(err => {
     console.log(err);
     res.status(500).send({error: err.message})
   });
   

   同时可以把端口监听日志修改为打印实际分配的端口，方便排查：app.listen(process.env.PORT, () => console.log("Listening on PORT " + process.env.PORT))

5. 缺失path模块引入
   代码中使用了path.join处理静态资源路径，如果app.js开头没有引入path模块，会导致生产环境加载静态资源时报错，服务崩溃。
   解决方式：在app.js开头添加const path = require('path')。

验证方式 #

本地先模拟生产环境运行，执行NODE_ENV=production npm start看本地能否正常启动，再去Heroku执行heroku logs --tail查看实时运行日志，可快速定位具体报错点。

内容的提问来源于stack exchange，提问作者Leji Kedus -_-