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) })