Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Proxying WebSocket requests is broken #10878

Open
minus7 opened this issue Apr 25, 2021 · 1 comment · May be fixed by #12583
Open

Proxying WebSocket requests is broken #10878

minus7 opened this issue Apr 25, 2021 · 1 comment · May be fixed by #12583

Comments

@minus7
Copy link

minus7 commented Apr 25, 2021

Describe the bug

Setting the proxy field in package.json proxies normal HTTP requests and WebSocket requests.

For normal requests, the Origin header is patched to equal the target host (added in #1212).

For websocket requests, the onProxyReq hook is not executed and thus the original Origin is sent to the target server. The target server will likely reject the request because Host and Origin mismatch (Gorilla websockts in my case). To also patch Origin for websocket requests, the onProxyReqWs hook has to be specified additionally.

Steps to reproduce

  1. Add a breakpoint or console.log in the onProxyReq callback mentioned above.
  2. yarn start any created project with a configured proxy
  3. Open a websocket connection
  4. See nothing getting logged because only onProxyReqWs is called for websocket connections.

Expected behavior

Origin and Host are equal for proxied websocket requests (e.g. http://localhost:8080).

Actual behavior

Origin is the original header sent by the browser (e.g. http://localhost:3000) while Host is changed (e.g. http://localhost:8080).

--

Note: I'd have sent a patch, but I refuse to sign the CLA.

@minus7 minus7 changed the title Proxy does not patch Origin header for WebSocket requests Proxying WebSocket requests is broken May 1, 2021
treuherz added a commit to treuherz/create-react-app that referenced this issue Jul 11, 2022
Similar to CORS controls, WebSocket servers are often (see below)
configured to check the Origin header of incoming requests. The config
for the HTTP proxy overwrites requests' Origin header to prevent issues
with CORS, but didn't previously do the same thing for WebSockets, as
they are controlled by a different config key.

Fixes facebook#10878
@treuherz treuherz linked a pull request Jul 11, 2022 that will close this issue
@dedo1911
Copy link

Related to #5280

treuherz added a commit to treuherz/create-react-app that referenced this issue Sep 12, 2022
Similar to CORS controls, WebSocket servers are often (see below)
configured to check the Origin header of incoming requests. The config
for the HTTP proxy overwrites requests' Origin header to prevent issues
with CORS, but didn't previously do the same thing for WebSockets, as
they are controlled by a different config key.

Fixes facebook#10878
treuherz added a commit to treuherz/create-react-app that referenced this issue Apr 3, 2024
Similar to CORS controls, WebSocket servers are often (see below)
configured to check the Origin header of incoming requests. The config
for the HTTP proxy overwrites requests' Origin header to prevent issues
with CORS, but didn't previously do the same thing for WebSockets, as
they are controlled by a different config key.

Fixes facebook#10878
treuherz added a commit to treuherz/create-react-app that referenced this issue Apr 3, 2024
Similar to CORS controls, WebSocket servers are often (see below)
configured to check the Origin header of incoming requests. The config
for the HTTP proxy overwrites requests' Origin header to prevent issues
with CORS, but didn't previously do the same thing for WebSockets, as
they are controlled by a different config key.

Fixes facebook#10878
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants