Cannot GET /reset-password/token

I’m building a web application using React for the frontend and Express for the backend. I have a feature where users can reset their passwords using a unique token sent via email. However, when I try to access the reset password page with a token in the URL (e.g., /reset-password/56ee236da78383854dfb584343d56048259c6977), I’m encountering the error message “Cannot GET /reset-password/56ee236da78383854dfb584343d56048259c6977”.

app.js

        <Route path="/reset-password/:token" element={<ResetPassword />} />

resetpassword.jsx

import React, { useState } from 'react';
import { useParams } from 'react-router-dom';
import axios from 'axios';


const ResetPassword = () => {
  const { token } = useParams();
  const [newPassword, setNewPassword] = useState('');
  const [message, setMessage] = useState('');

  const handleOnSubmit = async (e) => {
    e.preventDefault();
    try {
      const response = await axios.post(
        `http://localhost:3000/auth/reset-password/${token}`,
        { newPassword },
        { headers: { 'Content-Type': 'application/json' } }
      );
      setMessage(response.data.message);
    } catch (error) {
      console.error('Error:', error);
      setMessage('Failed to reset password');
    }
  };

  return (
    <div>
      <h2>Reset Password</h2>
      <form onSubmit={handleOnSubmit}>
        <input
          type="password"
          placeholder="Enter new password"
          value={newPassword}
          onChange={(e) => setNewPassword(e.target.value)}
          required
        />
        <button type="submit">Reset Password</button>
      </form>
      <p>{message}</p>
    </div>
  );
};

export default ResetPassword;

router.js

router.get('/reset-password/:token', (req, res) => {
    const { token } = req.params;
    res.render('reset-password', { token });
});

router.post('/reset-password/:token', async (req, res) => {
    const { token } = req.params;
    const { newPassword } = req.body;

    try {
        // Encontre o usuário com o token de redefinição de senha
        const user = await User.findOne({
            resetPasswordToken: token,
            resetPasswordExpires: { $gt: Date.now() } // Verifique se o token ainda não expirou
        });

        if (!user) {
            return res.status(400).json({ message: 'Invalid or expired token' });
        }

        // Atualize a senha do usuário
        user.password = newPassword;
        user.resetPasswordToken = undefined;
        user.resetPasswordExpires = undefined;
        await user.save();

        res.json({ message: 'Password reset successfully' });
    } catch (error) {
        console.error('Error:', error);
        res.status(500).json({ message: 'Internal server error' });
    }
});