【问题标题】:Node.js Express route not working. 404 not foundNode.js Express 路由不起作用。 404 未找到
【发布时间】:2020-04-19 08:29:35
【问题描述】:

我将 axios 帖子发送到 /users/add,但我不断收到 404 错误。谁能给我一些关于我做错了什么的见解。

Server.js

app.use("/users", require("./routes/users"));

使所有用户路由都使用用户控制器

const express = require("express");
const cors = require("cors");
const mongoose = require("mongoose");

require("dotenv").config();

const app = express();
const PORT = process.env.PORT || 3000;

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

const DATABASE = process.env.MONGODB_URI || "mongodb://localhost/MongoSetup";

mongoose.connect(DATABASE, {
  useNewUrlParser: true,
  useCreateIndex: true,
  useUnifiedTopology: true,
});
mongoose.connection.once("open", () =>
  console.log(`--> SERVER.JS: Connected to ${DATABASE}`)
);
mongoose.connection.on("error", (err) => {
  console.log(`Mongoose connection err:\n${err}`);
});

app.use("/exercises", require("./routes/exercises"));
app.use("/users", require("./routes/users"));

app.listen(PORT, () => {
  console.log(`--> SERVER.JS: Server Running: http://localhost:3000/`);
});

routes/users.js

router.route("/add").post((req, res)

应该为用户/添加设置路由

const router = require("express").Router();
let User = require("../models/user.model");

router.route("/").get((req, res) => {
    User.find()
        .then(users => res.json(users))
        .catch(err => res.status(400).json("Error: " + err));
});

router.route("/add").post((req, res) => {
    const username = req.body.username;

    const newUser = new User({username});

    newUser.save()
        .then(() => res.json("User Added!"))
        .catch(err => res.status(400).json("Error: " + err));
});

module.exports = router;

create-user.component.js

axios.post("/users/add", user)

应该将新用户发送到 /users/add

import React, { Component } from "react";
import axios from "axios";

export default class CreateUser extends Component {
  state = {
    username: "",
  };

  handleInputChange = (event) => {
    const { name, value } = event.target;

    this.setState({
      [name]: value,
    });
  };

  handleSubmit = (event) => {
    event.preventDefault();
    const user = {
        username: this.state.username
    }

    console.log(user);
    axios.post("/users/add", user)
        .then(res => console.log(res.data));

    this.setState({
        username: ""
    })
  };

  render() {
    return (
      <div>
        <h3>Create New User</h3>
        <form onSubmit={this.handleSubmit}>
            <div className="form-group">
                <label>Username: </label>
                <input 
                    required
                    name="username"
                    className="form-control"
                    value={this.state.username}
                    onChange={this.handleInputChange}
                />
            </div>
            <div className="form-group">
                <input type="submit" value="Create User" className="btn btn-primary" />
            </div>
        </form>
      </div>
    );
  }
}

【问题讨论】:

  • /users/ 对你有用吗?
  • 不,它应该呈现用户。我什至添加了一个测试用户,当我点击 /users 时什么都没有返回
  • 它是否也返回 404?
  • 没有网络标签显示状态码为 304
  • 尝试首先修复该路线以确保一切正常。尝试在 /users/ 中返回一些简单的文本而不是用户。确保节点控制台中没有其他错误。

标签: javascript node.js reactjs mongodb express


【解决方案1】:

您只需创建一次快速路由器实例并在所有路由器(usersexercises)上使用它。

为路由工厂创建文件

const usersRoutes = require('../usersRoutes');
const exercisesRoutes = require('../exercisesRoutes');
const routerWapper = (router) => {
    usersRoutes(router)
    exercisesRoutes(router)

    return router
};
module.exports = routerWapper;

app.js

...
const express = require("express");
const app = express();
const router = app.router();
...
app.use('/', () => routerWapper(router));
...

用户路线

const userRoutes = (router) => {
    router.get("/users").get((req, res) => {
        User.find()
            .then(users => res.json(users))
            .catch(err => res.status(400).json("Error: " + err));
    });

    router.get("/users/add").post((req, res) => {
        const username = req.body.username;

        const newUser = new User({username});

        newUser.save()
            .then(() => res.json("User Added!"))
            .catch(err => res.status(400).json("Error: " + err));
    });
};

运动路线

const exercisesRoutes = (router) => {
    router.get("/exercises").get((req, res) => {
        User.find()
            .then(users => res.json(exercises))
            .catch(err => res.status(400).json("Error: " + err));
    });

};

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-07-28
    • 2014-05-16
    • 2017-04-29
    • 1970-01-01
    • 1970-01-01
    • 2018-08-14
    • 1970-01-01
    • 2021-09-04
    相关资源
    最近更新 更多