Passing formData to router over javascript fetch post method

Hey there.

I’m trying at the moment to pass form data after submit over a javascript to a controller.
I also try with JSON.stringify({a: 1, b: 2}) and get an empty return.

const form = document.getElementById('formDropzone');
 
form.addEventListener('submit', function(e) {
    e.preventDefault()
    formData = new FormData(form)
    fetch('upload/temp', {
      method: 'post',
      // body: formData, 
      body: JSON.stringify({a: 1, b: 2}), 
      headers: {
          'Accept': 'application/json',
          'Access-Control-Allow-Origin': '*',
          'Access-Control-Allow-Credentials': 'true',
          'Access-Control-Allow-Methods': 'GET,HEAD,OPTIONS,POST,PUT',
          'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept, Authorization',
          'Content-type': 'application/json; charset=utf-8'
      }
  }).then((response) => {
      return response.json()
  }).then((res) => {
      if (res.status === 201) {
          console.log("Work")
      }
  }).catch((error) => {
      console.log(error)
  })
})
[
            'pattern' => 'upload/temp',
            'method' => 'POST',
            'auth' => false,
            'action'  => function () {
               // $return = $_POST;

                $data = $_POST;
                $return = json_encode($data);
                return $return;  
            }
          ]

Maybe some have me hint.

'Content-type': 'application/json; charset=utf-8'

was the problem - now it works :slight_smile: