Failed to load resource: the server responded with a status of 400 (Bad Request)

Question

Error

SyntaxError: Unexpected token " in JSON at position 0

API

localhost:5000/api/notes/addnote

Backend fetch

{
  "title": "msy nsssode",
  "description": "msy nessssw node",
  "tag": "youtsube",
  "_id": "639f52fe3229edcb8fbaff02",
  "date": "1671385854719",
  "__v": 0
}

Front End

import React from "react";
import noteContext from "./noteContext";
import { useState } from "react";

const NoteState = (props) =\> {
const host = "http://localhost:5000/"
const noteInitial = \[\]

    const [notes, setNotes] = useState(noteInitial)
    
    //Add a Note
    const addNote = async (title, description, tag) => {
        //Fatch Note
    
        const response = await fetch(`${host}api/notes/addnote`, {
            method: 'POST', // *GET, POST, PUT, DELETE, etc.
            headers: {
                'Content-Type': 'application/json',
                'auth-token': 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7InVzZXIiOnsiaWQiOiI2Mzk4YmE5ZDc5YzUyYzc0ZWNiMTljODkifX0sImlhdCI6MTY3MDk1MzYyOX0.P_NkVud_5_kpOrCTOG9nMAxFowNT5VKslboBcYeDJXk'
            },
            body: JSON.stringify(title, description, tag) // body data type must match "Content-Type" header
        });
        const json = await response.json(); // parses JSON response into native JavaScript objects
        console.log(json)
    
        console.log("adding a new note")
        const note = {
            "_id": "639a00edea0a1c6ab5jjje19b6e7",
            "title": title,
            "description": description,
            "tag": tag,
            "date": "1671037166242",
            "__v": 0
        };
        setNotes(notes.concat(note))
    }
    
    return (
        <noteContext.Provider value={{addNote}}>
            {props.children};
        </noteContext.Provider>
    )

}

export default NoteState;

API is not fetched when I want to add notes by input tag. the same has been showing, when I am modified by modal.