It seems when I do a POST request with data, then I get the following error message in the console:

Access to XMLHttpRequest at 'http://localhost:8000/api/feedback/send/' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

So when I do a request like this it works fine:

request({
            method: 'post',
            url: `${process.env.APIURL}tags/`,
        })

But when I do the following request then it fails with that error message:

request({
            method: 'post',
            url: `${process.env.APIURL}feedback/send/`,
            data: {
                feedback: this.state.feedback,
                email: this.state.email,
            }
        })

my next.js app at localhost:3000 is doing a request to my laravel api at localhost:8000. In my laravel app I have the following cors config set:

return $next($request)
            ->header('Access-Control-Allow-Origin', 'http://localhost:3000')
            ->header('Access-Control-Allow-Credentials', 'true')
            ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
            ->header('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type, X-Token-Auth, Authorization');

How come with the data object do I get that error message?