Axios首次POST请求返回404，后续请求正常问题求助

核心原因 #

首次请求404的关键问题在于React的setState是异步操作：
在verNotasAluno函数中，你先调用setMateria(String(responseProfessor[1]))，紧接着就用${materia}拼接请求URL。但setMateria不会立即更新materia的状态值，第一次提交时，URL里的materia还是初始状态值（大概率是空或undefined），导致请求路径变成/getNotasAluno/（或类似无效路径），后端找不到对应路由，返回404。

第二次提交时，materia已经完成更新，所以URL路径正确，请求能正常匹配后端路由。

解决方法 #

有两种简单的修正方式：

方式1：直接使用responseProfessor[1]拼接URL，跳过异步等待 #

既然你只是需要用responseProfessor[1]作为materia的值，没必要先存到状态里再使用，直接拼接更可靠：

function verNotasAluno(e) {
    e.preventDefault()
    const materia = String(responseProfessor[1])
    setMateria(materia) // 如果后续页面需要用到这个状态，保留这行；不需要可以删除
    axios
        .post(`http://localhost:3001/getNotasAluno/${materia}`, { lupaAluno })
        .then((response) => {
            if (response.data === 'Erro') {
                alert('Aluno não encontrado')
            } else {
                setNotasResponse(JSON.stringify(response.data))
            }
        })
}

方式2：利用setState回调确保状态更新后发请求 #

如果必须依赖materia状态的更新结果，就用setMateria的第二个回调参数（状态更新完成后执行）：

function verNotasAluno(e) {
    e.preventDefault()
    setMateria(String(responseProfessor[1]), () => {
        // 回调内的materia已是更新后的值
        axios
            .post(`http://localhost:3001/getNotasAluno/${materia}`, { lupaAluno })
            .then((response) => {
                if (response.data === 'Erro') {
                    alert('Aluno não encontrado')
                } else {
                    setNotasResponse(JSON.stringify(response.data))
                }
            })
    })
}

额外检查点 #

• 确认responseProfessor[1]的初始值是否有效：首次提交时它是否已经被正确赋值？如果它本身是undefined，即使修正异步问题，URL还是会无效。
• 后端路由校验：确保app.post('/getNotasAluno/:materia', ...)确实正确注册，且没有被其他路由规则拦截。

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