Блог

Я пытаюсь получить API входа в систему. API отлично работает на внутреннем сервере, но как только я пытаюсь использовать API со стороны интерфейса, он выдает ошибку Unexpected token I in JSON at position 0 .

Ниже приведен код

 import React, { useState } from "react"; import { useNavigate } from "react-router-dom";  const LoginPage = (props) =gt; {  let navigate = useNavigate();  const [credentials, setCredentials] = useState({email:"",password:""});   const onChange = (e) =gt; {  setCredentials({ ...credentials, [e.target.name]: [e.target.value]})  // console.log(credentials); }   const handleSubmit = async(e) =gt; {   e.preventDefault();  const response = await fetch("http://localhost:5000/api/login", {  method: "POST",  headers: {  "Content-Type": "application/json",  },  body: JSON.stringify({  email: credentials.email,  password: credentials.password,  }),  });  const json = await response.json();  console.log(json)    }  const goToSignUp = () =gt; {  navigate("/signup"); }    return (  lt;gt;  lt;div className="container my-5"gt;  lt;div id="loginbody"gt;  lt;div className="mt-3"gt;  lt;h2 className="my-3 display-3"gt;Login Herelt;/h2gt;  lt;form className="login-form p-5" onSubmit={handleSubmit}gt;  lt;div className="mb-3"gt;  lt;label htmlFor="exampleInputEmail1" className="form-label"gt;  Email address  lt;/labelgt;  lt;input  type="email"  className="form-control"  id="email"  name="email"  value={credentials.email}  aria-describedby="emailHelp"  onChange={onChange}  /gt;  lt;div id="emailHelp" className="form-text"gt;  We'll never share your email with anyone else.  lt;/divgt;  lt;/divgt;  lt;div className="mb-3"gt;  lt;label htmlFor="exampleInputPassword1" className="form-label"gt;  Password  lt;/labelgt;  lt;input  type="password"  className="form-control"  id="password"  name="password"  value={credentials.password}  onChange={onChange}  /gt;  lt;/divgt;  lt;div className="d-grid gap-2 my-4 col-6 mx-auto"gt;  lt;button type="submit" className="btn btn-success" gt;  Submit  lt;/buttongt;  lt;/divgt;  lt;hr /gt;  lt;div className="mb-3 text-center"gt;  lt;div id="emailHelp" className="form-text center my-3"gt;  Didn't have an account ?  lt;/divgt;  lt;div className="d-grid gap-2 my-3 col-6 mx-auto"gt;  lt;button onClick={goToSignUp} className="btn btn-success "gt;  SignUp Here !  lt;/buttongt;  lt;/divgt;  lt;/divgt;  lt;/formgt;  lt;/divgt;  lt;/divgt;  lt;/divgt; lt;/gt; ); };  export default LoginPage;  

Вот ss, показывающий ошибку в 1-й строке handleSUbmit() функции.

Также мой ответ API-

 {  "success": true,  "authToken": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkIjoiNjFiMzZlNGVmYTI5MWU1YjdlNWQzZTEwIn0sImlhdCI6MTYzOTI3NDgwMn0.p-Rh_yNe4N-sFZ0G_z7o76FXV9GyFx85xN7A424t9cI",  "user": {  "_id": "61b36e4efa291e5b7e5d3e10",  "name": "Mayank Maroliya",  "email": "mayank1@test.com",  "password": "$2a$10$BThh1HeUuhyFBmVc8YzPO.JILhPJsS4sg18sPGe86HmlBjh0svTmi",  "role": "guest",  "forgetQues": "Favourite Sport",  "forgetAns": "Chess",  "__v": 0  } }  

Я решаю эту ошибку в течение последнего часа, но она не устраняется. Могу ли я получить помощь?

Выяснив проблему, я передаю оба объекта email как в onChange функции.Так и должно быть String .

Неверный Код:

 setCredentials({ ...credentials, [e.target.name]: [e.target.value]})  

Исправленный Код:

 setCredentials({ ...credentials, [e.target.name]: e.target.value})