Помогите не могу найти ошибку код дает 404

import React, { useState } from 'react';
import loginstyle from './loginpage.module.css';
import { Navigate } from 'react-router-dom';
import { useAuthContext } from '../../contexts/AuthContext';
import { BASE_URL } from '../../utils/const';

const LoginPage = () => {
  const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');
  const [showPass, setShowPass] = useState(false);

  const handleSubmit = async (e) => {
    e.preventDefault();

    const data = {
      login: email,
      password: password,
    };

    try {
      const response = await fetch(
        'https://vm4506017.43ssd.had.wf/api/users/',
        {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json',
          },
          body: JSON.stringify(data),
        }
      );

      if (response.ok) {
        console.log('Регистрация прошла успешно');
      } else {
        console.error('Ошибка регистрации');
      }
    } catch (error) {
      console.error('Ошибка соединения', error);
    }
  };

  return (
    <div className={loginstyle.container}>
      <div className={loginstyle.login}>
        <span>Регистрация</span>
        <form onSubmit={handleSubmit}>
          <div className={loginstyle.inp_login}>
            <input
              placeholder="Почта/Email"
              type="email"
              value={email}
              autoComplete="username"
              onChange={(e) => setEmail(e.target.value)}
            />
            <input
              placeholder="Пароль"
              type={showPass ? 'text' : 'password'}
              required
              value={password}
              autoComplete="current-password"
              onChange={(e) => setPassword(e.target.value)}
            />
          </div>
          <div className={loginstyle.btn}>
            <button type="button" onClick={() => setShowPass(!showPass)}>
              {showPass ? 'Скрыть' : 'Показать'}
            </button>
            <button type="submit">Зарегистрироваться</button>
          </div>
          <div>
            <a href="#">Забыли пароль?</a>
            <a href="#">Уже зарегистрированы?</a>
          </div>
        </form>
      </div>
    </div>
  );
};

export default LoginPage;

Ответы (1 шт):

Автор решения: DIGMEN_GG
import React, { useState } from 'react';
import axios from 'axios';
import styles from './loginpag.css';
import { Navigate } from 'react-router-dom';

const LoginPage = () => {
  const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');
  const [showPass, setShowPass] = useState(false);
  const [registrationSuccess, setRegistrationSuccess] = useState(false);
  const handleSubmit = async (e) => {
    e.preventDefault();

    const data = {
      login: email,
      password: password,
    };

    try {
      const response = await axios.post(
        'https://vm4506017.43ssd.had.wf/api/users/',
        data
      );

      if (response.status >= 200 && response.status < 300) {
        console.log('Регистрация прошла успешно');
        setRegistrationSuccess(true);
      } else {
        console.error('Ошибка регистрации');
      }
    } catch (error) {
      console.error('Ошибка соединения', error);
    }
  };

  if (registrationSuccess) {
    return <Navigate to="/" />;
  }

  return (
    <div style={{ marginTop: '80px' }}>
      <div className="lmain">
        <input type="checkbox" id="chk" aria-hidden="true" />
        <div className="llogin">
          <form className="lform">
            <label for="chk" aria-hidden="true">
              Log in
            </label>
            <input
              className="linput"
              type="email"
              name="email"
              placeholder="Имя"
              required=""
            />
            <input
              className="linput"
              type="password"
              name="pswd"
              placeholder="Пароль"
              required=""
            />
            <button>Войти</button>
          </form>
        </div>

        <div className="lregister">
          <form onSubmit={handleSubmit} className="lform">
            <label for="chk" aria-hidden="true">
              Регистрации
            </label>
            <input
              className="linput"
              placeholder="Имя"
              value={email}
              autoComplete="username"
              onChange={(e) => setEmail(e.target.value)}
              required=""
            />
            <input
              className="linput"
              placeholder="Пароль"
              type={showPass ? 'text' : 'password'}
              required
              value={password}
              autoComplete="current-password"
              onChange={(e) => setPassword(e.target.value)}
            />
            <button>Зарегистрироваться</button>
          </form>
        </div>
      </div>
    </div>
  );
};

export default LoginPage;

я решил так

→ Ссылка