javascript - Express.js，我新添加的路由出现 404(未找到)错误

Question

我在为我的项目创建第二条路线时遇到了一些问题。虽然 router.get("/getallrooms") 工作正常，但 router.post("/getroombyid") 却给我 404 not found留言:

POST http://localhost:3000/book/api/rooms/getroombyid 404 (Not Found)

我附上了我的路线代码，预订屏幕，我正在尝试使用此 getroombyid 路线和 server.js 代码。我很乐意接受任何建议。

const express = require('express');
const router = express.Router();

const Room = require('../models/room')


router.get("/getallrooms", async(req, res) =>{

    try{
        const rooms = await Room.find({})
        res.send(rooms)
    }
    catch(error){
        return res.status(400).json({message: error});
    }
});

router.post("/getroombyid", async(req, res) => {
    const roomid = req.body.roomid
    try {
         const room = await Room.findOne({'_id' : req.body.roomid})
         res.send(room)
    } catch (error) {
         return res.status(400).json({ message: error });
    }
});

module.exports = router

预订屏幕

import React, {useState, useEffect} from 'react'
import axios from 'axios'

function Bookingscreen({match}) {

  const [loading, setloading] = useState()
  const [error, seterror] = useState()
  const [room, setroom] = useState()

  useEffect(() => {
    try {
        setloading(true)
        async function gettingRoom() {
            const data = (await axios.post('./api/rooms/getroombyid', {roomid : match.params.roomid})).data
            setroom(data)
            setloading(false)
        }
        gettingRoom()
    }
    catch (error) {
        seterror(true)
        console.log(error)
        setloading(false)
    }
  }, [])

  return (
    <div>
        <h1>Bookingscreen</h1>
        <h1>Room id = {match.params.roomid}</h1>
    </div>
  )
}

export default Bookingscreen

服务器.js

const express = require("express");

const app = express();
const dbConfig = require('./db')

const roomsRoute = require('./routes/roomsRoute')
app.use(express.json())
app.use('/api/rooms', roomsRoute)

const port = process.env.PORT || 5000;

app.listen(port, () => {
    console.log(`App listening on port ${port}`)
});

Answer 1

问题是由以下行引起的，特别是 ./api 部分:

const data = (await axios.post('./api/rooms/getroombyid', {roomid : match.params.roomid})).data

你正在做的是考虑到你当前在浏览器中的 url，我假设它是 /book，所以最终请求是:

http://localhost:3000/book/api/rooms/getroombyid

您的后端不存在。用这一行更改上面的行:

const data = (await axios.post('/api/rooms/getroombyid', {roomid : match.params.roomid})).data