Why is Cyrillic data not transmitted via fetch during a POST request?

Question

JavaScript

Customer:

let userName = 'Yana';
    let text = "text";

    fetch('/chat', {
        headers: {
            "Content-type": "application/x-www-form-urlencoded; charset=UTF-8",
            'body': [text, userName],
            'Content-Type': 'application/json'
        },
        method: 'POST',
    })

On server:

router.post('/',function(req,res){
  console.log('post!!!', req.headers.body);
  res.status(200).send();
});

On startup, the server doesn't respond at all, but in the browser console this is: "chatScript.js:14 Uncaught (in promise) TypeError: Failed to execute 'fetch' on 'Window': Value is not a valid ByteString.
at HTMLSpanElement.buttonSendMe. onclick(chatScript.js:14)".
Here ("HTMLSpanElement.buttonSendMe.onclick") is an element that, when clicked, sends a text string to the script.
If text and userName contain Latin text, then everything is ok...
What should I do? How to decide?

Answer 1

Correct the headers, two Content-Type with different quotes and types of transmitted data indicates that you copied it from somewhere, and besides, the body was stuffed there as an array.
Here is a piece of working code for a post request (and not only):

if (type.toLowerCase() === 'post') {
    params = JSON.stringify(params);
  }

  const fetchOptions = {
    method: type,
    mode: REQUEST_API.mode,
    headers: new Headers({
      Accept: 'application/json',
      'Content-Type': 'application/json'
    }),
    credentials: REQUEST_API.credentials,
    body: params
  };

return fetch(url, fetchOptions);

params in the case of a post request will be an object with a request body.
In case it does not help, it is recommended to familiarize yourself with the form and encoding , use fetch