React+Devise+Axios更新密码时出现ActionController路由错误求助

你遇到的情况是密码更新逻辑正常，但终端反复出现ActionController::RoutingError (No route matches [PUT] "/")，核心原因是除了/users/password的请求外，页面里还有其他请求意外指向了根路径/，以下是具体排查和解决步骤：

1. 阻止表单默认提交行为 #

如果onFinish是表单组件（比如Ant Design Form）的提交回调，表单默认的提交行为会触发浏览器向当前页面路径（通常是/）发送请求，这是最常见的原因。修改代码：

const onFinish = (values, e) => {
    e.preventDefault(); // 阻止默认表单提交
    setLoading(true);
    const session = { "user": { ...values, reset_password_token: params.get("reset_password_token") } }
    const path = "/users/password"
    setAxiosHeaders();
    axios.put(path, session)
        .then((response) => {
            console.log(response.data)
        })
        .catch((error) => {
            console.log(error);
        })
}

2. 检查setAxiosHeaders函数 #

查看这个设置请求头的函数，是否错误修改了Axios的全局配置，比如误将baseURL设为"/"，导致后续某些请求的路径拼接错误：

// 错误示例：不要这样设置
axios.defaults.baseURL = "/";
// 正确应该是保持baseURL为空或者设为你的API根路径，比如"/api"

3. 排查页面其他请求 #

打开浏览器开发者工具的Network面板，筛选所有请求，看是否有额外的PUT/PATCH请求指向/，可能是：

• 其他组件的Axios请求路径写错（比如漏写了具体路径）
• 静态资源（图片、样式、脚本）的路径配置错误，导致浏览器请求/
• 第三方插件或工具发起的额外请求

4. 确认Devise路由（可选） #

虽然密码更新成功，但可以通过终端运行rails routes | grep password确认路由是否正确，正常输出应该包含：

PUT    /users/password(.:format)       devise/passwords#update
PATCH  /users/password(.:format)       devise/passwords#update

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