Below code is my fetch method in my separate register.js. This is my newly created js file, so I can create my front end. At the moment I’m just trying to console.log the ending result for this fetch, but can’t get the output since I’m getting an error when I try to POST this.
error in browser console: “Uncaught (in promise) SyntaxError: Unexpected token S in JSON at position 0”
fetch(`${rootUrl}api/users/register`,{
method:"POST",
headers:{
"Content-Type": "application/json"
},
body:JSON.stringify({
firstName: firstName,
lastName: lastName,
mobileNo: mobileNo,
email: email,
password: password
})
})
.then(result=>result.json())
.then(result =>{
console.log(result);
})
In userRouter.js, this is the route I’m fetching in register.js above:
router.post('/register', (req, res)=>{
userController.register(req.body).then(result => res.send(result))})
And the route leads to this controller in Usercontroller.js:
module.exports.register = (reqBody)=>{
//check if email already exists before registering new user
return User.find({email: reqBody.email}).then((result, error) =>{
if(result.length != 0){
return "EMAIL EXISTS!";
}else{
let newUser = new User({
firstName: reqBody.firstName,
lastName: reqBody.lastName,
email:reqBody.email,
password: bcrypt.hashSync(reqBody.password, 10),
mobileNo: reqBody.mobileNo
})
return newUser.save().then((result, error)=>{
if (error){
return error;
}else{
return "SUCCESFULLY REGISTERED NEW USER";
}
})
}
})}
As you can see, this is a registration form. Everything works fine in the backend, using postman to enter values. All my condition prompts are being returned(emails exist, successful registration).
But when I tried creating a frontend for it, I can’t get my defined prompts.Like when I deliberately input a duplicate email, I can’t get the message “Email exists” that I used to get when using only postman or just backend API functionality.
I feel like something is very wrong with what I’m trying to do. I’m having trouble creating a frontend for my API which I’m not used at the moment.
Advertisement
Answer
You are returning a non JSON response, so you can’t use res.json(). You are simply sending a text response. So use res.text()
fetch('/your-endpoint').then((res)=>{
return res.text();
}).then((text)=>{
console.log(text)
})