From b8bf54d14d9d0f27b04712f3d970a7c002349b1f Mon Sep 17 00:00:00 2001 From: James Blight Date: Sun, 21 May 2017 11:13:44 +0930 Subject: [PATCH 1/2] Update docs with WebSocket proxy information --- packages/react-scripts/template/README.md | 33 +++++++++++++++++++++++ 1 file changed, 33 insertions(+) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 25b469fb680..5bc725fc697 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -44,6 +44,7 @@ You can find the most recent version of this guide [here](https://github.com/fac - [Proxying API Requests in Development](#proxying-api-requests-in-development) - ["Invalid Host Header" Errors After Configuring Proxy](#invalid-host-header-errors-after-configuring-proxy) - [Configuring the Proxy Manually](#configuring-the-proxy-manually) + - [Configuring a WebSocket Proxy](#configuring-a-websocket-proxy) - [Using HTTPS in Development](#using-https-in-development) - [Generating Dynamic `` Tags on the Server](#generating-dynamic-meta-tags-on-the-server) - [Pre-Rendering into Static HTML Files](#pre-rendering-into-static-html-files) @@ -982,6 +983,38 @@ You may also narrow down matches using `*` and/or `**`, to match the path exactl } ``` +### Configuring a WebSocket Proxy + +When setting up a WebSocket proxy, there are a some extra considerations to be aware of. +If you're using a WebSocket engine like [Socket.io](https://socket.io/), you must have a Socket.io server running that you can use as the proxy target. +Socket.io will not work with a standard WebSocket server. Specifically, don't expect Socket.io to work with [the websocket.org echo test](http://websocket.org/echo.html) +There's some good documentation available for [setting up a Socket.io server](https://socket.io/docs/) + +Standard WebSockets **will** work with a standard WebSocket server as well as the websocket.org echo test. +You can use libraries like [ws](https://github.com/websockets/ws) for the server, with [native WebSockets in the browser](https://developer.mozilla.org/en-US/docs/Web/API/WebSocket) + +Either way, you can proxy WebSocket requests manually in `package.json` +```js +{ + // ... + "proxy": { + "/socket": { + // Your compatible WebSocket server + "target": "ws://", + // Tell http-proxy-middleware that this is a WebSocket proxy. + // Also Allows you to proxy WebSocket requests without an additional http request + // https://github.com/chimurai/http-proxy-middleware#external-websocket-upgrade + "ws": true + // ... + } + } + // ... +} +``` + + + + ## Using HTTPS in Development >Note: this feature is available with `react-scripts@0.4.0` and higher. From 1c415a67378fa1018999da505111c265b253baaf Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Tue, 27 Jun 2017 17:21:40 +0100 Subject: [PATCH 2/2] Tweak wording --- packages/react-scripts/template/README.md | 18 ++++++++---------- 1 file changed, 8 insertions(+), 10 deletions(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 5bc725fc697..2d174167225 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -986,14 +986,15 @@ You may also narrow down matches using `*` and/or `**`, to match the path exactl ### Configuring a WebSocket Proxy When setting up a WebSocket proxy, there are a some extra considerations to be aware of. -If you're using a WebSocket engine like [Socket.io](https://socket.io/), you must have a Socket.io server running that you can use as the proxy target. -Socket.io will not work with a standard WebSocket server. Specifically, don't expect Socket.io to work with [the websocket.org echo test](http://websocket.org/echo.html) -There's some good documentation available for [setting up a Socket.io server](https://socket.io/docs/) -Standard WebSockets **will** work with a standard WebSocket server as well as the websocket.org echo test. -You can use libraries like [ws](https://github.com/websockets/ws) for the server, with [native WebSockets in the browser](https://developer.mozilla.org/en-US/docs/Web/API/WebSocket) +If you’re using a WebSocket engine like [Socket.io](https://socket.io/), you must have a Socket.io server running that you can use as the proxy target. Socket.io will not work with a standard WebSocket server. Specifically, don't expect Socket.io to work with [the websocket.org echo test](http://websocket.org/echo.html). + +There’s some good documentation available for [setting up a Socket.io server](https://socket.io/docs/). + +Standard WebSockets **will** work with a standard WebSocket server as well as the websocket.org echo test. You can use libraries like [ws](https://github.com/websockets/ws) for the server, with [native WebSockets in the browser](https://developer.mozilla.org/en-US/docs/Web/API/WebSocket). + +Either way, you can proxy WebSocket requests manually in `package.json`: -Either way, you can proxy WebSocket requests manually in `package.json` ```js { // ... @@ -1002,7 +1003,7 @@ Either way, you can proxy WebSocket requests manually in `package.json` // Your compatible WebSocket server "target": "ws://", // Tell http-proxy-middleware that this is a WebSocket proxy. - // Also Allows you to proxy WebSocket requests without an additional http request + // Also allows you to proxy WebSocket requests without an additional HTTP request // https://github.com/chimurai/http-proxy-middleware#external-websocket-upgrade "ws": true // ... @@ -1012,9 +1013,6 @@ Either way, you can proxy WebSocket requests manually in `package.json` } ``` - - - ## Using HTTPS in Development >Note: this feature is available with `react-scripts@0.4.0` and higher.