'Missing draft message' in Javascript

I am working on this issue from last 3 days. I dived through the stack overflow, but of no use. There are the questions about "Missing draft message", but I am still getting this message. I have tried all the ways they have said. but I am still here. Here is my code

const str = "My Draft";
  const msgBody = btoa(str);
 
var token = localStorage.getItem("accessToken");

fetch(
  "https://gmail.googleapis.com/gmail/v1/users/me/drafts?key=[my api key] HTTP/1.1", 
  {
    
    method:"post",
    ContentType: 'application/json',
    Accept: 'application/json',
        headers: {
            
        "Authorization": `Bearer ${token}`,
        
    },
        message: {
            raw: msgBody
          }
  }
)
  .then((data) => data.json())
  .then((response) => console.log(response));

please add message in body https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#supplying_request_options

const str = "My Draft";
const msgBody = btoa(str);
 
var token = localStorage.getItem("accessToken");

fetch(
  "https://gmail.googleapis.com/gmail/v1/users/me/drafts?key=[my api key] HTTP/1.1", 
  {
    method: 'POST',
    ContentType: 'application/json',
    Accept: 'application/json',
    headers: {
        "Authorization": `Bearer ${token}`,
    },
    body: JSON.stringify({ // Here changed 
        message: {
            raw: msgBody
        }
    }),
  }
)
  .then((data) => data.json())
  .then((response) => console.log(response));