Skip to content

Commit 0306396

Browse files
committed
Add docs for the multiple proxy object syntax
Related to issue facebook#3348
1 parent 1a61cd4 commit 0306396

File tree

1 file changed

+11
-0
lines changed

1 file changed

+11
-0
lines changed

packages/react-scripts/template/README.md

+11
Original file line numberDiff line numberDiff line change
@@ -992,6 +992,17 @@ Conveniently, this avoids [CORS issues](http://stackoverflow.com/questions/21854
992992
Fetch API cannot load http://localhost:4000/api/todos. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
993993
```
994994

995+
The development server can also be configured to proxy requests to multiple API servers using the _object_ syntax, for example:
996+
997+
```js
998+
"proxy": {
999+
"/auth": { "target": "http://localhost:3333" },
1000+
"/api": { "target": "http://localhost:4444" }
1001+
}
1002+
```
1003+
1004+
This way, when you `fetch('/api/todos')` in development, the development server will match against the _context_ key (i.e. `/api`) and proxy the request to `http://localhost:4444`. Similarly, when you `fetch('/auth/login', {...})`, the development server will match against the other _context_ key and proxy the request to `http://localhost:3333`.
1005+
9951006
Keep in mind that `proxy` only has effect in development (with `npm start`), and it is up to you to ensure that URLs like `/api/todos` point to the right thing in production. You don’t have to use the `/api` prefix. Any unrecognized request without a `text/html` accept header will be redirected to the specified `proxy`.
9961007

9971008
The `proxy` option supports HTTP, HTTPS and WebSocket connections.<br>

0 commit comments

Comments
 (0)