Failed to load resource: the server responded with a status of 431 (Request Header Fields Too Large)

The HTTP 431 Request Header Fields Too Large response status code indicates that theserver refuses to process the request because the request’s HTTP headers are too long.The request may be resubmitted after reducing the size of the request headers.431 can be used when the total size of request headers is too large, or when a singleheader field is too large. To help those running into this error, indicate which of the > two is the problem in the response body — ideally, also include which headers are toolarge. This lets users attempt to fix the problem, such as by clearing their cookies.Servers will often produce this status if:The Referer URL is too longThere are too many Cookies sent in the request

In my case I was sending too many cookies because localhost:4200 was used as the domain of 3 different projects ... The solution (delete useless cookies)

Hope this helps...

I was getting that error when forgetting to run my server first, before running React app.

I used a knex.js and express.js based simple back end and forgot to initialize it before starting React. Now it all works fine.

I was getting this error when I used the same local port in the proxy destination as the port of the React app by accident. This created an internal forwarding loop, resulting in "Request Header Fields Too Large".