error: SyntaxError: Unexpected token B in JSON at position 0 - node.js

Question

I am trying to set up a user register form using react and then sending the inputs to the express backend api to register the new user. I keep gettting the error: Register.js:19 POST http://localhost:3000/api/register 400 (Bad Request) and: error: SyntaxError: Unexpected token B in JSON at position 0 on the client side. On the server side I try and console.log(req.body) and only an empty object gets returned.
My react register code
import React from 'react'
class Register extends React.Component {
state = {
name: "",
username: "",
password: ""
}
handleChange = event => {
const { name, value } = event.target
this.setState({[name]:value})
}
handleSubmit = event => {
event.preventDefault();
fetch("/api/register", {
method: "POST",
body: JSON.stringify(this.state),
headers: {
'Content-Type': 'application/json'
}
}).then(res => res.json())
.then(response => console.log("success:", JSON.stringify(response)))
.catch(error => console.log("error:", error));
}
render() {
return (
<div>
<form onSubmit={this.handleSubmit}>
<input type="text" name="name" value={this.state.name} placeholder="name" onChange={this.handleChange} />
<input type="text" name="username" value={this.state.username} placeholder="username" onChange={this.handleChange} />
<input type="password" name="password" value={this.state.password} placeholder="password" onChange={this.handleChange} />
<button>Register</button>
</form>
</div>
)
}
}
export default Register
Server side code
const express = require("express"),
passport = require("passport"),
User = require("../models/user");
const router = express.Router({mergeParams: true});
// /api before this
router.post("/register", (req, res)=>{
console.log(req.body);
const newUser = new User({
username: req.body.username,
name: req.body.name
});
User.register(newUser, req.body.password, (err, user)=>{
if(err) {
console.log(err);
}
passport.authenticate("local")(req, res, ()=>{
res.json(user);
});
});
});
module.exports = router;