POST 404 找不到 vue，mongodb，axios，express

Question

为了练习，我正在创建一个简单的应用程序，其功能类似于基于文本的游戏，其中“页面”是从数据库加载并显示的。我正在尝试使用 axios 将我的 mongo 后端与 vue 前端连接起来。数据库本身工作正常（我检查了 mongo shell，）我只是没有从前端发布到正确的位置。

我确信这是一个非常明显的修复，但我已经盲目地处理这个项目，我需要有人指出我遗漏了什么。 XD

top/backend/server.js

const express = require('../frontend/node_modules/express');
const bodyParser = require("../frontend/node_modules/body-parser");

const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
    extended: false
}));

const mongoose = require('../frontend/node_modules/mongoose');

mongoose.connect('mongodb://127.0.0.1:27017/dragons-world', {
    useNewUrlParser: true
});

//ADD
app.post('/api/pages', async (req, res) => {

  const page = new Page({
    title: req.body.title,
    text: req.body.text
  });

  try {
    await page.save();
    res.send(page);
  }
  catch (error) {
    console.log(error);
    res.sendStatus(500);
  }
});

app.listen(3000, () => console.log('Server listening on port 3000!'));

top/frontend/src/views/Admin.vue

//this method is called on button click in the html
async addPage() {
  console.log("adding page...");
  try {
    await axios.post('/api/pages', {
      title: this.title,
      text: this.text,
    });
    console.log('getting pages...');
    console.log(this.getPages());
    this.getPages();
    console.log("successful!");
    return true;
  }
  catch (error) {
    console.log(error);
  }
},

Answer 1

已修复！在前端添加了一个“vue.config.js”文件，内容如下：

module.exports = {
  devServer: {
    proxy: 'http://localhost:3000',
  }
}

POST 404 找不到 vue，mongodb，axios，express

POST 404 not found with vue, mongodb, axios, express

mongodb

vue.js

express

axios

http-status-code-404