无法删除并在 router.delete 中出现 404 未找到错误

Question

在我的应用程序中，我在 router.delete 中传递请求参数 ID，并与 vuex 服务进行通信。虽然触发操作 api 被触发但未找到 404 并且也没有请求负载。

快递route.delete

    router.delete('/favorites/:favoriteId', (req, res) => {
    res.status(200).send(Number(req.params.favoriteId));
  });

Vuex 服务

 /**
 *
 * @param {*} favouriteId number
 */

export async function deleteUserFavourites(favouriteId) {
    const response = await http.delete('favorites',favouriteId);
    return response;
}

vuex 动作

async removeFavorites({ commit }, payload) {
    const favourites = await service.deleteUserFavourites({
        id: payload.favouriteId
    });
    commit('removeFavorites', favourites);
},

组件动作触发器

async handleListClick(item) {
            console.log(item.id);
            await this.removeFavorites({
                id: item.id
            });
        }
    }

在api响应中显示

server.js

    const path = require('path');
const fs = require('fs');
const express = require('express');
const webpack = require('webpack');

// Express Server Setup
const server = express();
server.use(express.json());
server.use(express.urlencoded({ extended: true }));
server.use(express.static('public'));

// Webpack HMR
const webpackConfig = require('./webpack.config.local');
const compiler = webpack(webpackConfig);
const webpackDevMiddleware = require('webpack-dev-middleware')(
    compiler,
    webpackConfig.devServer
);
const webpackHotMiddleware = require('webpack-hot-middleware')(compiler);
server.use(webpackDevMiddleware);
server.use(webpackHotMiddleware);

// Server Startup
server.listen(3000, () => {
    console.log('*****************************************');
    console.log('*****************************************');
    console.log('** Server is listening at PORT 3000. ****');
    console.log('** http://localhost:3000/      ****');
    console.log('*****************************************');
    console.log('*****************************************');
});

// Mock APIs
const router = require('express').Router();
const routesPath = path.join(__dirname, './routes');
const filenames = fs.readdirSync(routesPath);
filenames.forEach(file => {
    if (file.endsWith('.js')) {
        console.log(`route ${file} loaded`);
        router.use('/', require(path.join(routesPath, file)));
    }
});
server.use('/api', router);

// Vue entrypoint
const template = require('./template');
server.get('/**', (req, res) => {
    const page = template();
    res.header('Content-Type', 'text/html').send(page);
});

Answer 1

由于您的 api 端点是这样的：'/favorites/:favoriteId'，您必须在请求结束时应用 favoriteId url 而不是在正文中。所以你的请求必须是这样的：

export async function deleteUserFavourites(favouriteId) {
const response = await http.delete('favorites/' + favoriteId.toString());
return response;

}

无法删除并在 router.delete 中出现 404 未找到错误

Cannot Delete and getting 404 not found error in router.delete

javascript

express

vue.js

vuex