You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: packages/react-scripts/template/README.md
+19-76
Original file line number
Diff line number
Diff line change
@@ -49,7 +49,6 @@ You can find the most recent version of this guide [here](https://github.com/fac
49
49
-[Proxying API Requests in Development](#proxying-api-requests-in-development)
50
50
-["Invalid Host Header" Errors After Configuring Proxy](#invalid-host-header-errors-after-configuring-proxy)
51
51
-[Configuring the Proxy Manually](#configuring-the-proxy-manually)
52
-
-[Configuring a WebSocket Proxy](#configuring-a-websocket-proxy)
53
52
-[Using HTTPS in Development](#using-https-in-development)
54
53
-[Generating Dynamic `<meta>` Tags on the Server](#generating-dynamic-meta-tags-on-the-server)
55
54
-[Pre-Rendering into Static HTML Files](#pre-rendering-into-static-html-files)
@@ -1095,92 +1094,36 @@ We don’t recommend this approach.
1095
1094
1096
1095
### Configuring the Proxy Manually
1097
1096
1098
-
> Note: this feature is available with `react-scripts@1.0.0` and higher.
1097
+
> Note: this feature is available with `react-scripts@2.0.0` and higher.
1099
1098
1100
-
If the `proxy` option is **not** flexible enough for you, you can specify an object in the following form (in `package.json`).<br>
1101
-
You may also specify any configuration value [`http-proxy-middleware`](https://github.com/chimurai/http-proxy-middleware#options) or [`http-proxy`](https://github.com/nodejitsu/node-http-proxy#options) supports.
1099
+
If the `proxy` option is **not** flexible enough for you, you can get direct access to the Express app instance and hook up your own middleware.
1102
1100
1103
-
```js
1104
-
{
1105
-
// ...
1106
-
"proxy": {
1107
-
"/api": {
1108
-
"target":"<url>",
1109
-
"ws":true
1110
-
// ...
1111
-
}
1112
-
}
1113
-
// ...
1114
-
}
1115
-
```
1101
+
First, install `http-proxy-middleware` using npm or Yarn:
1116
1102
1117
-
All requests matching this path will be proxies, no exceptions. This includes requests for `text/html`, which the standard `proxy` option does not proxy.
1103
+
```bash
1104
+
$ npm install http-proxy-middleware --save
1105
+
$ # or
1106
+
$ yarn add http-proxy-middleware
1107
+
```
1118
1108
1119
-
If you need to specify multiple proxies, you may do so by specifying additional entries.
1120
-
Matches are regular expressions, so that you can use a regexp to match multiple paths.
1109
+
Next, create `src/setupProxy.js` and place the following contents in it:
1121
1110
1122
1111
```js
1123
-
{
1124
-
// ...
1125
-
"proxy": {
1126
-
// Matches any request starting with /api
1127
-
"/api": {
1128
-
"target":"<url_1>",
1129
-
"ws":true
1130
-
// ...
1131
-
},
1132
-
// Matches any request starting with /foo
1133
-
"/foo": {
1134
-
"target":"<url_2>",
1135
-
"ssl":true,
1136
-
"pathRewrite": {
1137
-
"^/foo":"/foo/beta"
1138
-
}
1139
-
// ...
1140
-
},
1141
-
// Matches /bar/abc.html but not /bar/sub/def.html
1142
-
"/bar/[^/]*[.]html": {
1143
-
"target":"<url_3>",
1144
-
// ...
1145
-
},
1146
-
// Matches /baz/abc.html and /baz/sub/def.html
1147
-
"/baz/.*/.*[.]html": {
1148
-
"target":"<url_4>"
1149
-
// ...
1150
-
}
1151
-
}
1112
+
constproxy=require('http-proxy-middleware');
1113
+
1114
+
module.exports=function(app) {
1152
1115
// ...
1153
-
}
1116
+
};
1154
1117
```
1155
1118
1156
-
### Configuring a WebSocket Proxy
1157
-
1158
-
When setting up a WebSocket proxy, there are a some extra considerations to be aware of.
1159
-
1160
-
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).
1161
-
1162
-
There’s some good documentation available for [setting up a Socket.io server](https://socket.io/docs/).
1163
-
1164
-
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).
1165
-
1166
-
Either way, you can proxy WebSocket requests manually in `package.json`:
1119
+
You can now register proxies as you wish! Here's an example using the above `http-proxy-middleware`:
1167
1120
1168
1121
```js
1169
-
{
1170
-
// ...
1171
-
"proxy": {
1172
-
"/socket": {
1173
-
// Your compatible WebSocket server
1174
-
"target":"ws://<socket_url>",
1175
-
// Tell http-proxy-middleware that this is a WebSocket proxy.
1176
-
// Also allows you to proxy WebSocket requests without an additional HTTP request
0 commit comments