Facing - 'Uncaught (in promise) SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data'

Question

我正在使用事件函数 postData() 发送我的注册表单数据，该事件函数在单击提交时触发 button.In 反应代码，在注册路由中我向用户发送 data.Also注释中的行号 -

   const postData = async(event) =>{
        event.preventDefault();

    const { name, email, phone, work, password, cpassword} = user;

    const response = await fetch('/register' , {
        method: 'POST',
        headers : {
            "Content-Type" : "application/json"
        },
        body: JSON.stringify({
            name: name,
            email : email,
            phone : phone,
            work : work,
            password: password,
            cpassword : cpassword
        })
    });

    console.log('1'); //line 44!!!!

    const data = await response.json();

    console.log('1'); //line 48

    if(data){
        console.log('1'); //line 51

        window.alert("registration successful");
        console.log("registration successful");
        history.push('/login');

    }else{   //line 57!!!!

        console.log('1'); //line 58

        window.alert("Invalid registration");
        console.log("Invalid registration");
    }
    console.log('1');   //line 63

}

在我的快速代码中，我将它存储在数据库中 -

router.post('/register' , (req,res)=>{

const {name, email, phone, work, password, cpassword} = req.body;

//we are checking if any of the inputs are empty or not
if(!name || !email || !phone || !work || !password || !cpassword){
    return res.status(422).send('Please Fill All The Fields');
}

//we are observing if a user already registered or not by checking it's email
User.findOne({email : email})
        .then((userExist) =>{
                if(userExist){
                    return res.status(422).send('Email already exists');
                }else if(password !== cpassword){
                    return res.status(422).send('Passwords are not matching');
                }

                //if the email dont exist , that means the user is new and we will store it's data in the DB
                const user = new User({
                    name : name,
                    email : email,
                    phone : phone,
                    work : work,
                    password : password,
                    cpassword : cpassword,
        });

            

//saved the stored data in the DB
            user.save()
            .then(()=>{
                res.status(201).send('User registered Successfully')
            })
            .catch((err)=>{
                res.status(500).send(err);
            })

    }).catch((err)=>{
        console.log(err);
    })
})

我能够将用户数据存储在数据库中，但我无法在 console.And 中看到警报和控制台消息，我还使用 useHistory 挂钩重定向到登录注册后的页面，但我没有被重定向到 it.In 控制台，我遇到了这个错误，还添加了 'console.log('1')' 来检查代码是否为运行或 not.But 在第 44 行控制台之后，我在第 57 行遇到错误。

我仍在学习 mern 开发，所以我仍然是 newbie.Please 帮我解决这个问题 issue.Thanks 很多。

Answer 1

您可以在这里做两件事：

或者：

return res.status(422).send({message: 'Passwords are not matching'});

或

return res.status(422).json("Passwords are not matching");

如果您在前端使用第一个选项，您可以使用 data.message

访问消息

Facing - 'Uncaught (in promise) SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data'

Facing - 'Uncaught (in promise) SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data'

javascript

json

express

reactjs

mern