Bug:

Created by: MikiWiX

While using proxy (for development purposes) React is adding a "Refer" HTTP header. The contents for mentioned header is by default "http://localhost:3000", which is true for local machine it is running on. But when connecting to a remote serrver with CSRF enabled, like with Laravel, that value breaks the response causing it to fail (code 419), probably because the server treats "localhost" as different reference than our local machine. I am not sure whenever it is a bug, but maybe changing the value to actual IP of local machine will fix those issues.

React version: 18.0.0

Steps To Reproduce

1. npx create-react-app
2. set proxy to a remote backend server with CSRF token (tested for Laravel server)
3. try to POST/GET any data, even the first request will fail with code 419
4. or send the same request as react does (visible through wireshark or similiar programm) using postman/curl
5. if we remove or modify he "Refer" header, everything will work as intended. You can input ANY String, just not localhost

The current behavior

Requests fail because of CSRF key mismatch caused by reference to localhost passed to server

The expected behavior

The server will have IP passed as a refrence, so the requests won't fail (hopefully)