You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

MEVN栈Vue游戏应用部署后Node.js API无响应,本地运行正常

MEVN栈游戏应用部署后无法获取数据排查求助

我正在开发首个基于MEVN栈的简单游戏Vue应用,本地开发环境下前后端交互完全正常,可与MongoDB正常收发数据,但部署到Vercel和Render平台后无法从服务器获取数据,恳请帮忙排查问题。

文件结构

/root
├─ config.js
├─ server.js
├─ package.json + package-lock.json
├─ client/
│  ├─ vue.config.json
│  └─ ... (其余dist、src、node_modules、public等文件)
├─ models/
│  ├─ Elf.js
│  └─ HighScore.js
└─ routes/
   └─ api/
      ├─ elf.js
      └─ highScore.js

config.js

module.exports = {
  hostUrl: process.env.HOST_URL,
  mongoURI: process.env.MONGO_URI,
  PORT: process.env.PORT || 3000,
};

server.js

const express = require("express");
const app = express();
const port = 3000;
const mongoose = require("mongoose");
const { PORT, mongoURI } = require("./config.js");
// routes
const Player = require("./routes/api/player");
const Elf = require("./routes/api/elf");
const HighScore = require("./routes/api/highScore");
// cors是允许前端向后端发送请求的中间件
const cors = require("cors");
// morgan是将所有请求记录到控制台的中间件
const morgan = require("morgan");
// body-parser是允许我们访问请求体的中间件
const bodyParser = require("body-parser");
const path = require("path");

app.use(cors());

// 使用tiny模式仅记录请求方法和状态码
app.use(morgan("tiny"));
app.use(bodyParser.json());

// 检查是否处于生产环境
if (process.env.NODE_ENV === "production") {
  // 启用静态文件服务
  app.use(express.static("client/dist"));
  app.get("*", (req, res) => {
    res.sendFile(path.resolve(__dirname, "client", "dist", "index.html"));
  });
}

// 测试服务器是否运行及MongoDB连接状态
app.get("/", (req, res) => {
  res.send("Hello World!");
});

// 使用路由
app.use("/api/", Player);
app.use("/api/", Elf);
app.use("/api/", HighScore);

mongoose
  .connect(mongoURI, {
    useNewUrlParser: true,
    useUnifiedTopology: true,
    useUnifiedTopology: true,
  })
  .then(() => console.log("MongoDB connected..."))
  .then(() => {
    // 在控制台打印连接地址
    console.log(`MongoDB connected to ${mongoURI}`);
  })
  .catch((err) => console.log(err));

app.listen(PORT, () => {
  console.log(`Example app listening at ${PORT}`);
});

package.json

{
  "name": "week1",
  "version": "1.0.0",
  "description": "",
  "main": "server.js",
  "scripts": {
    "server": "nodemon server.js --ignore 'client/'",
    "client": "npm run serve --prefix client",
    "dev": "concurrently \"npm run server\" \"npm run client\"",
    "start": "node server.js",
    "build": "npm install --prefix client && npm run build --prefix client"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "body-parser": "^1.20.1",
    "bootstrap": "^5.2.3",
    "cors": "^2.8.5",
    "dotenv": "^16.0.3",
    "express": "^4.18.2",
    "mongoose": "^6.7.5",
    "morgan": "^1.10.0",
    "portal-vue": "^2.1.7"
  },
  "devDependencies": {
    "concurrently": "^7.6.0",
    "nodemon": "^2.0.20"
  }
}

本地运行情况

  • 开发环境:在根目录执行npm run dev启动,应用运行流畅,可正常与MongoDB交互,访问地址为http://localhost:8080。
  • 静态服务测试:安装npm install -g serve后执行serve -s dist启动服务(地址localhost:36797),应用也能正常运行。

部署问题

尝试将应用部署至Vercel和Render平台,但均出现反馈信息少、无法获取数据的问题。

内容的提问来源于stack exchange,提问作者JayRichh

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.09 20:10:26