У меня есть несколько страниц в приложении React, которые генерируют ошибку «Неизвестная конечная точка», если страница обновляется. Однако страница загружается нормально при первой загрузке. Обе страницы с формами. Я просматриваю журналы Heroku и, например, для своей страницы входа, если она обновлена, я вижу ошибку кода состояния 404. Я не уверен, в чем может быть проблема, но я помню, что в моих исследованиях реагирования это могло означать, что сервер не завершил получение данных. Я не уверен, является ли это проблемой или нет, но был бы рад получить некоторые разъяснения по этому вопросу. Благодарность!

мой компонент входа ниже

import React from "react";
import { connect } from "react-redux";
import {
  Form,
  Button,
  Grid,
  Header,
  Message,
  Segment
} from "semantic-ui-react";
import { Link, withRouter } from "react-router-dom";
import { login } from "../reducers/loginReducer";
import { setNotification } from "../reducers/notificationReducer";
import { useField } from "../hooks";
import { logout } from "../reducers/loginReducer";

const LoginForm = props ={amp}gt; {
  const username = useField("text");
  const password = useField("password");

  const logout = () ={amp}gt; {
    props.logout();
  };

  const handleLogin = async event ={amp}gt; {
    event.preventDefault();
    try {
      const user = { username: username.value, password: password.value };
      await props.login(user);
      username.reset();
      password.reset();
      props.history.push("/");
    } catch (error) {
      props.setNotification("Sorry wrong username or password.", 5);
    }
  };

  if (props.loggedUser.id !== undefined)
    return (
      {amp}lt;p{amp}gt;
        You are currently logged in. Would you like to{" "}
        {amp}lt;Link onClick={logout} to="/"{amp}gt;
          logout?
        {amp}lt;/Link{amp}gt;
      {amp}lt;/p{amp}gt;
    );

  return (
    {amp}lt;{amp}gt;
      {amp}lt;Grid centered columns={2}{amp}gt;
        {amp}lt;Grid.Column{amp}gt;
          {amp}lt;Header as="h2" textAlign="center"{amp}gt;
            {amp}lt;Segment{amp}gt;
              {amp}lt;Link to="/"{amp}gt;
                {amp}lt;img
                  src={`${process.env.PUBLIC_URL}/assets/images/all-vintage-search-logo.png`}
                  alt="All Vintage Search"
                  height="60px"
                /{amp}gt;
              {amp}lt;/Link{amp}gt;
            {amp}lt;/Segment{amp}gt;
          {amp}lt;/Header{amp}gt;
          {amp}lt;Segment{amp}gt;
            {amp}lt;Form onSubmit={handleLogin} size="large"{amp}gt;
              {amp}lt;Form.Input
                fluid
                icon="user"
                iconPosition="left"
                placeholder="Username"
                id="username"
                {...username.omitreset}
              /{amp}gt;
              {amp}lt;Form.Input
                fluid
                icon="lock"
                iconPosition="left"
                placeholder="Password"
                type="password"
                {...password.omitreset}
              /{amp}gt;

              {amp}lt;Button color="blue" fluid size="large"{amp}gt;
                Login
              {amp}lt;/Button{amp}gt;
            {amp}lt;/Form{amp}gt;
          {amp}lt;/Segment{amp}gt;
          {amp}lt;Message{amp}gt;
            Not registered yet? {amp}lt;Link to="/newuser"{amp}gt;Sign Up{amp}lt;/Link{amp}gt;
          {amp}lt;/Message{amp}gt;
        {amp}lt;/Grid.Column{amp}gt;
      {amp}lt;/Grid{amp}gt;
    {amp}lt;/{amp}gt;
  );
};

const mapStateToProps = state ={amp}gt; {
  return {
    notification: state.notification,
    loggedUser: state.loggedUser
  };
};

const mapDispatchToProps = {
  login,
  setNotification,
  logout
};

const Login = withRouter(LoginForm);

export default connect(mapStateToProps, mapDispatchToProps)(Login);