使用axios.delete发起请求时遭遇404(Not found)错误求助

结合你提供的前后端代码，以下是几个可能导致404错误的排查方向：

1. 前端userId变量未正确赋值 #

前端请求URL依赖userId变量，如果该变量为空、未定义或值无效，最终请求的URL会变成https://tinderclonepmish.herokuapp.com/delete/（末尾无userId参数），后端的/delete/:userId路由需要匹配带参数的路径，自然会返回404。

验证方式：在handleDelete函数开头添加日志，确认userId的值：

const handleDelete = async () => {
    console.log('当前userId:', userId); // 检查变量是否有效
    try {
        const response = await axios.delete(`https://tinderclonepmish.herokuapp.com/delete/${userId}`)
        if (response.status === 200) console.log('response success ')
    } catch (error) {
        console.log(error.message)
    }
}

2. 后端路由注册顺序问题 #

如果后端在app.delete('/delete/:userId')之后注册了通配符路由（比如app.get('*', (req, res) => res.sendFile(...))），会导致所有未匹配到前面路由的请求被通配符路由拦截，但通配符路由只处理GET请求，DELETE请求会返回404。

解决方式：确保DELETE路由在所有通配符路由之前注册，比如：

// 先注册具体路由
app.delete('/delete/:userId', async (req, res) => {
    console.log(req.params.userId)
})
app.put('/user', async (req, res) => {
    // PUT路由逻辑
})

// 最后注册通配符路由
app.get('*', (req, res) => {
    // 处理前端路由逻辑
})

3. 后端DELETE路由未正确挂载 #

检查DELETE路由是否和正常工作的PUT路由在同一个文件中，并且该文件已经被正确导入到主服务器入口文件（比如server.js）。如果DELETE路由所在的模块未被require或import，路由根本不会被注册，自然无法匹配请求。

4. Heroku部署缓存或未完成 #

如果是刚更新后端代码部署到Heroku，可能存在部署未生效或缓存问题。可以通过以下方式排查：

• 执行heroku logs --tail查看实时日志，确认后端是否接收到了DELETE请求，以及日志中的具体错误信息
• 重启Heroku dyno：heroku restart

5. 路由大小写或拼写不一致 #

HTTP路由路径是大小写敏感的，检查前端请求的/delete/和后端路由的/delete/:userId是否完全一致（比如是否后端写成了/Delete/:userId），拼写错误会导致路由匹配失败。

6. CORS配置（次要排查） #

虽然PUT请求正常，但仍需确认后端CORS配置是否允许DELETE方法。如果CORS只允许GET、PUT等方法，DELETE请求可能被拦截，但这种情况通常会返回CORS错误而非404，不过可以补充验证：

const cors = require('cors');
// 显式允许所需HTTP方法
app.use(cors({
    methods: ['GET', 'PUT', 'POST', 'DELETE']
}));

内容的提问来源于stack exchange，提问作者Edris Elbow